限制复选框的最大可选数


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 相关文章推荐
JavaScript 自动分号插入(JavaScript synat:auto semicolon insertion)
Nov 04 Javascript
关于jQuery参考实例 1.0 jQuery的哲学
Apr 07 Javascript
手机端网页点击链接触发自动拨打或保存电话的示例代码
Aug 15 Javascript
iScroll中事件点击触发两次解决方案
Mar 11 Javascript
js点击列表文字对应该行显示背景颜色的实现代码
Aug 05 Javascript
原生JavaScript来实现对dom元素class的操作方法(推荐)
Aug 16 Javascript
js中的 || 与 &amp;&amp; 运算符详解
May 24 Javascript
基于vue+uniapp直播项目实现uni-app仿抖音/陌陌直播室功能
Nov 12 Javascript
javascript实现异形滚动轮播
Nov 28 Javascript
angular inputNumber指令输入框只能输入数字的实现
Dec 03 Javascript
js实现无缝轮播图特效
May 09 Javascript
vue el-tree 默认展开第一个节点的实现代码
May 15 Javascript
让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开源建站平台小结
2010/04/22 PHP
将二维数组转为一维数组的2种方法
2014/05/26 PHP
php简单实现单态设计模式的方法分析
2017/07/28 PHP
PHP实现在对象之外访问其私有属性private及保护属性protected的方法
2017/11/20 PHP
PHP优化之批量操作MySQL实例分析
2020/04/23 PHP
javascript 常用代码技巧大收集
2009/02/25 Javascript
过虑特殊字符输入的js代码
2010/08/05 Javascript
JavaScript制作的可折叠弹出式菜单示例
2014/04/04 Javascript
Javascript中的delete操作符详细介绍
2014/06/06 Javascript
js中document.write的那点事
2014/12/12 Javascript
JS实现文档加载完成后执行代码
2015/07/09 Javascript
Prototype框架详解
2015/11/25 Javascript
vue 文件目录结构详解
2017/11/24 Javascript
Angularjs实现控制器之间通信方式实例总结
2018/03/27 Javascript
微信小程序访问豆瓣电影api的实现方法
2019/03/31 Javascript
微信小程序实现圆形进度条动画
2020/11/18 Javascript
详解React中共享组件逻辑的三种方式
2021/02/02 Javascript
[02:19]DOTA2上海特级锦标赛 观赛指南 Spectator Guide
2016/02/04 DOTA
[00:32]2018DOTA2亚洲邀请赛Newbee出场
2018/04/03 DOTA
使用Python下的XSLT API进行web开发的简单教程
2015/04/15 Python
python 安装virtualenv和virtualenvwrapper的方法
2017/01/13 Python
python实现日常记账本小程序
2018/03/10 Python
python 获取文件下所有文件或目录os.walk()的实例
2018/04/23 Python
Python3.5 处理文本txt,删除不需要的行方法
2018/12/10 Python
Python实现微信小程序支付功能
2019/07/25 Python
Python Numpy,mask图像的生成详解
2020/02/19 Python
python模拟斗地主发牌
2020/04/22 Python
Python爬取酷狗MP3音频的步骤
2021/02/26 Python
amazeui页面校验功能的实现代码
2020/08/24 HTML / CSS
英国第一家领先的在线处方眼镜零售商:Glasses Direct
2018/02/23 全球购物
Skyscanner加拿大:全球旅行搜索平台
2018/11/19 全球购物
ALDO美国官网:加拿大女鞋品牌
2018/12/28 全球购物
自我鉴定范文300字
2013/10/01 职场文书
国庆横幅标语
2014/10/08 职场文书
2014年办公室文员工作总结
2014/11/12 职场文书
Python基础之赋值,浅拷贝,深拷贝的区别
2021/04/30 Python