限制复选框的最大可选数


Posted in Javascript onJuly 01, 2006

<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>

Javascript 相关文章推荐
jQuery中.live()方法的用法深入解析
Dec 30 Javascript
javaScript中Math()函数注意事项
Jun 18 Javascript
javascript实现控制的多级下拉菜单
Jul 05 Javascript
jquery实现点击查看更多内容控制段落文字展开折叠效果
Aug 06 Javascript
JavaScript小技巧整理
Dec 30 Javascript
jQuery ready()和onload的加载耗时分析
Sep 08 Javascript
JavaScript中如何使用cookie实现记住密码功能及cookie相关函数介绍
Nov 10 Javascript
javascript 开发之网页兼容各种浏览器
Sep 28 Javascript
微信小程序如何获取openid及用户信息
Jan 26 Javascript
详解Angular操作cookies方法
Jun 01 Javascript
Angularjs 根据一个select的值去设置另一个select的值方法
Aug 13 Javascript
关于vue中如何监听数组变化
Apr 28 Vue.js
让innerHTML的脚本也可以运行起来
Jul 01 #Javascript
DEFER怎么用?
Jul 01 #Javascript
让插入到 innerHTML 中的 script 跑起来的实现代码
Jul 01 #Javascript
在网页中控制wmplayer播放器
Jul 01 #Javascript
Javascript的IE和Firefox兼容性汇编
Jul 01 #Javascript
提高代码性能技巧谈—以创建千行表格为例
Jul 01 #Javascript
对textarea框的代码调试,而且功能上使用非常方便,酷
Jun 30 #Javascript
You might like
替换php字符串中的单引号为双引号的方法
2017/02/16 PHP
PHP基于SMTP协议实现邮件发送实例代码
2017/04/27 PHP
浅谈Javascript事件模拟
2012/06/27 Javascript
如何解决Jquery库及其他库之间的$命名冲突
2013/09/15 Javascript
jQuery随手笔记之常用的jQuery操作DOM事件
2015/11/29 Javascript
jQuery zTree加载树形菜单功能
2016/02/25 Javascript
JavaScript正则表达式的贪婪匹配和非贪婪匹配
2017/09/05 Javascript
requireJS模块化实现返回顶部功能的方法详解
2017/10/16 Javascript
深入理解Vue官方文档梳理之全局API
2017/11/22 Javascript
微信小程序日期时间选择器使用方法
2018/02/01 Javascript
浅谈Webpack 是如何加载模块的
2018/05/24 Javascript
浅谈Vue.use的使用
2018/08/29 Javascript
angular2组件中定时刷新并清除定时器的实例讲解
2018/08/31 Javascript
JS实现判断移动端PC端功能
2020/02/21 Javascript
Python中的Numeric包和Numarray包使用教程
2015/04/13 Python
Python的Django框架中自定义模版标签的示例
2015/07/20 Python
python算法表示概念扫盲教程
2017/04/13 Python
Python3实现简单可学习的手写体识别(实例讲解)
2017/10/21 Python
Python迭代器iterator生成器generator使用解析
2019/10/24 Python
在Pytorch中计算自己模型的FLOPs方式
2019/12/30 Python
TensorFlow 输出checkpoint 中的变量名与变量值方式
2020/02/11 Python
如何开发一款堪比APP的微信小程序(腾讯内部团队分享)
2016/12/22 HTML / CSS
将HTML5 Canvas的内容保存为图片借助toDataURL实现
2013/05/20 HTML / CSS
HTML5中原生的右键菜单创建方法
2016/06/28 HTML / CSS
EM Cosmetics官网:由彩妆大神Michelle Phan创办的独立品牌
2020/04/27 全球购物
广州盈通面试题
2015/12/05 面试题
《独坐敬亭山》教学反思
2014/04/08 职场文书
党校毕业心得体会
2014/09/13 职场文书
退休党员个人对照检查材料思想汇报
2014/09/29 职场文书
离婚协议书范文2014(夫妻感情破裂)
2014/12/14 职场文书
中学生思想品德评语
2014/12/31 职场文书
教师个人学习总结
2015/02/11 职场文书
2015年财务工作总结范文
2015/03/31 职场文书
保险公司客户经理岗位职责
2015/04/09 职场文书
虚拟机linux端mysql数据库无法远程访问的解决办法
2021/05/26 MySQL
mysql如何配置白名单访问
2021/06/30 MySQL