限制复选框的最大可选数


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 相关文章推荐
?牟┛途W扣了一??效果出?? target=
May 27 Javascript
JavaScript XML实现两级级联下拉列表
Nov 10 Javascript
javascript 时间比较实现代码
Oct 28 Javascript
为Extjs加加速(javascript加速)
Aug 19 Javascript
jquery1.9 下检测浏览器类型和版本的方法
Dec 26 Javascript
json的使用小结
Jun 08 Javascript
JS获取年月日时分秒的方法分析
Nov 28 Javascript
javascript中闭包概念与用法深入理解
Dec 15 Javascript
JQuery ZTree使用方法详解
Jan 07 Javascript
bootstrap tooltips在 angularJS中的使用方法
Apr 10 Javascript
使用layer模态框给新页面传值的方法
Sep 27 Javascript
layui实现form表单同时提交数据和文件的代码
Oct 25 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生成随机数或者字符串的代码
2008/09/05 PHP
一个不易被发现的PHP后门代码解析
2014/07/05 PHP
PHP PDOStatement::closeCursor讲解
2019/01/30 PHP
laravel-admin 后台表格筛选设置默认的查询日期方法
2019/10/03 PHP
javascript window对象属性整理
2009/10/24 Javascript
JS中令人发指的valueOf方法介绍
2013/02/22 Javascript
js设置document.domain实现跨域的注意点分析
2015/05/21 Javascript
基于jQuey实现鼠标滑过变色(整行变色)
2015/12/07 Javascript
基于jQuery的网页影音播放器jPlayer的基本使用教程
2016/03/08 Javascript
纯JS实现只能输入数字的简单代码
2017/06/21 Javascript
极简主义法编写JavaScript类
2017/11/02 Javascript
基于ES6作用域和解构赋值详解
2017/11/03 Javascript
详解webpack打包时排除其中一个css、js文件或单独打包一个css、js文件(两种方法)
2018/10/26 Javascript
记录微信小程序 height: calc(xx - xx);无效问题
2019/12/30 Javascript
Vue使用vue-draggable 插件在不同列表之间拖拽功能
2020/03/12 Javascript
使用Vue-cli 中为单独页面设置背景图片铺满全屏
2020/07/17 Javascript
js里面的变量范围分享
2020/07/18 Javascript
用Python遍历C盘dll文件的方法
2015/05/06 Python
Python中time模块和datetime模块的用法示例
2016/02/28 Python
Python与R语言的简要对比
2017/11/14 Python
如何在python中使用selenium的示例
2017/12/26 Python
Centos7 Python3下安装scrapy的详细步骤
2018/03/15 Python
Python Django框架单元测试之文件上传测试示例
2019/05/17 Python
python使用tkinter库实现五子棋游戏
2019/06/18 Python
python GUI库图形界面开发之PyQt5中QWebEngineView内嵌网页与Python的数据交互传参详细方法实例
2020/02/26 Python
使用Python实现NBA球员数据查询小程序功能
2020/11/09 Python
html5理解head_动力节点Java学院整理
2017/07/13 HTML / CSS
乐高西班牙官方商店:LEGO Shop ES
2019/12/01 全球购物
欧姆龙医疗保健与医疗产品:Omron Healthcare
2020/02/10 全球购物
实习老师个人总结的自我评价
2013/09/28 职场文书
会计实习期自我鉴定
2013/10/06 职场文书
两则小学生的自我评价分享
2013/11/14 职场文书
刑事法律意见书
2015/06/04 职场文书
不同品牌、不同型号对讲机如何互相通联
2022/02/18 无线电
redis复制有可能碰到的问题汇总
2022/04/03 Redis
TS 类型兼容教程示例详解
2022/09/23 Javascript