限制复选框的最大可选数
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>html－www.51windows.Net</title>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!--
//checkbox元素的名字前缀，本例为sample1,sample2,sample3...
var sCtrlPrefix = "sample";
//checkbox元素数量，本例有18个；
var iMaxCheckbox = 18;
//设置最大允许选择的数量；
var iMaxSelected = 5;
function doCheck(ctrl) {
var iNumChecked = 0;
var thisCtrl;
var i;
//初始化
i = 1;
//循环直到选中了最多的checkbox;
while ((i <= iMaxCheckbox) && (iNumChecked <= iMaxSelected)) {
thisCtrl = eval("ctrl.form." + sCtrlPrefix + i);
if ((thisCtrl != ctrl) && (thisCtrl.checked)) {
iNumChecked++;
}
i++;
}
// 检查是否达到了最大选择数量；
if (iNumChecked == iMaxSelected) {
// 如果是则uncheck刚选择的元素；
ctrl.checked = false;
}
}
// -->
</SCRIPT>
<form name="form" method="post">
<table align="center" border="1" cellpadding="5" cellspacing="0">
<tr>
<td>
<input type="CHECKBOX" name="sample1" onClick="doCheck(this)">
A</td>
<td>
<input type="CHECKBOX" name="sample2" onClick="doCheck(this)">
B</td>
<td>
<input type="CHECKBOX" name="sample3" onClick="doCheck(this)">
C</td>
</tr>
<tr>
<td>
<input type="CHECKBOX" name="sample4" onClick="doCheck(this)">
D</td>
<td>
<input type="CHECKBOX" name="sample5" onClick="doCheck(this)">
E</td>
<td>
<input type="CHECKBOX" name="sample6" onClick="doCheck(this)">
F</td>
</tr>
<tr>
<td>
<input type="CHECKBOX" name="sample7" onClick="doCheck(this)">
G</td>
<td>
<input type="CHECKBOX" name="sample8" onClick="doCheck(this)">
H</td>
<td>
<input type="CHECKBOX" name="sample9" onClick="doCheck(this)">
I</td>
</tr>
<tr>
<td>
<input type="CHECKBOX" name="sample10" onClick="doCheck(this)">
J</td>
<td>
<input type="CHECKBOX" name="sample11" onClick="doCheck(this)">
K</td>
<td>
<input type="CHECKBOX" name="sample12" onClick="doCheck(this)">
L</td>
</tr>
<tr>
<td>
<input type="CHECKBOX" name="sample13" onClick="doCheck(this)">
M</td>
<td>
<input type="CHECKBOX" name="sample14" onClick="doCheck(this)">
N</td>
<td>
<input type="CHECKBOX" name="sample15" onClick="doCheck(this)">
O</td>
</tr>
<tr>
<td>
<input type="CHECKBOX" name="sample16" onClick="doCheck(this)">
P</td>
<td>
<input type="CHECKBOX" name="sample17" onClick="doCheck(this)">
Q</td>
<td>
<input type="CHECKBOX" name="sample18" onClick="doCheck(this)">
R</td>
</tr>
</table>
</form>
</body>
</html>
<div style="position: absolute; top: 10; right: 10; width: 148; height: 18;cursor:hand">
<input type="button" name="Button" value="查看源代码" onClick= 'window.location = "view-source:" + window.location.href'></div>
相关推荐
-
限制复选框的最大可选数的js代码
在一些网页应用中,就比如在投票系统中,当我们进行的是多项投票时,我们要求用户最多只能选择几项进行投票,这也是就是说选择复选框的个数最多几个. 那么如何设置这最多的几个,我们就需要做些简单的脚本处理.以下代码均转摘自互联网,作者不详. 比如如下的代码则解决了相关问题: A B C D E F G H I J [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 改代码最需要注意的是 //checkbox元素的名字前缀,本例为sample1,sample2,sample3... var sCt
-
限制复选框的最大可选数
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>html-www.51windows.Net</title> </head> <body> <SCRIPT LANGUAGE="JavaScript"> <!-- //
-
JQuery限制复选框checkbox可选中个数的方法
本文实例讲述了JQuery限制复选框checkbox可选中个数的方法.分享给大家供大家参考.具体分析如下: 由于项目需要限制可批量操作的文件个数 所以写了一段小代码 如果选中个数大于允许的最大个数 其他复选框不能选择 如果小于则所有复选框都能选择 <script type="text/javascript"> $(document).ready(function() { $('input[type=checkbox]').click(function() { $("
-
BootStrap表单控件之复选框checkbox和单选择按钮radio
1.运行效果如图所示 2.实现代码如下 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>表单控件--复选框checkbox和单选择按钮radio</title> <!-- 最新版本
-
jquery 操作单选框，复选框，下拉列表实现代码
1.复选框全选操作:其实说到底就是对Jquery 选择器的运用,点我查看Jquery选择器 html代码: 复制代码 代码如下: <form> 您爱好的运动是: <input type="checkbox" name="item" value="football"/> football <input type="checkbox" name="item" value="
-
利用Bootstrap实现表格复选框checkbox全选
首先来看看实现的效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以正常的表格布局就行了: <table class="table table-bordered table-hover"> <thead> <tr class="success"> <th>类别编号</th> <th>类别名称</th> <th>类别组</th> <th
-
java通过复选框控件数组实现添加多个复选框控件示例分享
思路如下: 创建JPanel面板对象:使用JPanel类的setLayout(0,4)方法设置网格布局管理器,即列数为4,行数自动调节:创建一个字符串型一维数组作为控件文本数组:创建一个JCheckBox型一维数组作为控件数组:使用for循环遍历控件数组,初始化数组中的复选框组件,使用JPanel类的add()方法把数组元素(即每个复选框)添加到面板中.代码如下: 复制代码 代码如下: package cn.edu.xidian.crytoll; import java.awt.BorderLa
-
Swing常用组件之单选按钮和复选框
本文为大家分享了Swing单选按钮和复选框的使用方法,供大家参考,具体内容如下 JRadioButton构造函数: JRadioButton():建立一个新的JRadioButton. JRadioButton(Icon icon):建立一个有图像但没有文字的JRadioButton. JRadioButton(Icon icon,boolean selected):建立一个有图像但没有文字的JRadioButton,且设置其初始状态(有无被选取). JRadioButton(String te
-
Java框架学习Struts2复选框实例代码
复选框在Web开发中使用的非常多,现在我们通过struts2的复选框标签来实现一些在开发中经常遇到的问题. 先来看看这个标签的属性: 注:listKey相当于HTML中的value属性,这个值在和后台交互时才真正是我们在后台要使用的:listValue只是内容的显示而已. 案例1 用户选择了喜欢的课程,现在要对已经选择的课程进行修改,跳转到修改界面,然后回显已经勾选的课程. 用户已选课程界面: 点击按钮后进入课程修改界面: 注:在修改界面要对用户最初的选择进行回显. 代码实现!!!! 用户已选课
-
jquery获取复选框被选中的值
复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <mce:style><!-- --></mce:style><style mce_bogus="1"> &l