html Checkbox 多选用jquery限制最多可选数
amx 和new Array(1) 根据自己的需要定,以下是代码:
<script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
var max = 2; //最多的可选数
var num = 0; //checkbox已选钩的数量
var arr = new Array(1); //存放选项的数组
$(function () {
$(":checkbox").click(clic); //为所有checkbox加入click事件
$("#sent").click(sent);
});
//点击事件
function clic() {
var t = this; //取得被点击的checkbox
var v = t.value; //选中的值
//如果选中
if (t.checked) {
if (num >= max) {
t.checked = false;
alert("最多只能选两个!");
}
else {
//还没到最多的可选数,添加到为空的无素中
if (arr[0] == null) {
arr[0] = v;
// alert(arr[0] + "0");
}
else {
arr[1] = v;
// alert(arr[1] + "1");
}
num++;
}
}
else {//遍历存放选项的数组找出值相同的替换为null
for (var i = 0; i < 2; i++) {
if (arr[i] == v) {
arr[i] = null;
}
}
num--;
}
}
function sent() {
$.post("MyCh.ashx", { "ch1": arr[0], "ch2": arr[1] }, function (signal) {
if (signal == "0") {
alert(signal);
}
else {
alert(signal);
}
});
}
</script>
<body>
kaka <input id="Checkbox5" type="checkbox" name="ch" value="kaka" />
laal <input id="Checkbox6" type="checkbox" name="ch" value="lala" />
haha <input id="Checkbox7" type="checkbox" name="ch" value="haha" />
haha <input id="Checkbox8" type="checkbox" name="ch" value="jaja" />
<input type="button" id="sent" valu="提交"/>
</body>