JS实现统计复选框选中个数并提示确定与取消的方法
作者:纸飞机时间:2026-10-29 12:06:23浏览:497
本文介绍如何使用JavaScript统计页面中复选框的选中数量,并在用户点击提交时通过confirm弹窗确认操作。代码遍历名为ck[]的复选框,统计选中项后弹出包含数量的确认框,用户选择确定则执行后续逻辑,取消则返回false。
JavaScript统计复选框与确认逻辑实现
本文分享了一种使用JavaScript统计复选框选中数量,并在操作前通过弹窗提示用户确认或取消的方法。
具体的JavaScript实现代码如下:
<script type="text/javascript">
function yesno() {
var inputs = document.getElementsByName("ck[]");
var checked_counts = 0;
for(var i=0;i<inputs.length;i++){
if(inputs[i].checked){checked_counts++;
}
}
if(confirm("你已选择了 " + checked_counts + " 个网址,\n你确定选择删除过滤网址吗?")){
//return true;
ShowDiv('MyDiv','fade');
}else{
return false;
}
}
</script>
对应的HTML页面结构如下:
<form id="form1" name="form1" method="post" action="">
<input type="checkbox" name="ck[]" id="ck[]" value="{$vo.id}" onclick="javascript:chkRow(this);">
<input type="checkbox" name="ck[]" id="ck[]" value="{$vo.id}" onclick="javascript:chkRow(this);">
<input type="checkbox" name="ck[]" id="ck[]" value="{$vo.id}" onclick="javascript:chkRow(this);">
<input type="checkbox" name="ck[]" id="ck[]" value="{$vo.id}" onclick="javascript:chkRow(this);">
<input type="checkbox" name="ck[]" id="ck[]" value="{$vo.id}" onclick="javascript:chkRow(this);">
<input type="checkbox" name="ck[]" id="ck[]" value="{$vo.id}" onclick="javascript:chkRow(this);">
<input type="checkbox" name="ck[]" id="ck[]" value="{$vo.id}" onclick="javascript:chkRow(this);">
<input type="checkbox" name="ck[]" id="ck[]" value="{$vo.id}" onclick="javascript:chkRow(this);">
<input type="checkbox" name="ck[]" id="ck[]" value="{$vo.id}" onclick="javascript:chkRow(this);">
<input type="checkbox" name="ck[]" id="ck[]" value="{$vo.id}" onclick="javascript:chkRow(this);">
<input type="submit" name="submit" id="submit" class="subbut" onclick="return yesno();" value="选择删除信息">
</form>
希望本文提供的代码示例能对读者的JavaScript编程有所帮助。
作者最新文章
JS动态构建复杂嵌套JSON对象的方法
2026-11-05 15:41:52
JS负数取余为什么是负数?详解余数与模运算区别
2026-11-05 13:34:41
JS 解压出现乱码或报错怎么解决?
2026-11-05 12:32:38
JS 中 startsWith、indexOf 与正则判断字符串前缀的对比
2026-11-04 22:19:43
JS解析Excel后怎么将数据转换为JSON格式
2026-11-04 20:58:28
