复选框的全选和取消全选

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>复选框的全选和取消全选</title></head><body><script type="text/javascript">/*window.onload = function(){var firstChk = document.getElementById("firstChk");firstChk.onclick = function(){// 获取第一个复选框的选中状态(复选框对象checkbox对象)//alert(firstChk.checked);// 根据name获取所有元素var aihaos = document.getElementsByName("aihao");if(firstChk.checked){// 全选for(var i = 0; i < aihaos.length; i++){aihaos[i].checked = true;}}else{// 取消全选for(var i = 0; i < aihaos.length; i++){aihaos[i].checked = false;}}}}*/window.onload = function(){var aihaos = document.getElementsByName("aihao");var firstChk = document.getElementById("firstChk");firstChk.onclick = function(){for(var i = 0; i < aihaos.length; i++){aihaos[i].checked = firstChk.checked;}}// 对以上数组进行遍历var all = aihaos.length;for(var i = 0; i < aihaos.length; i++){aihaos[i].onclick = function(){var checkedCount = 0;// 总数量和选中的数量相等的时候,第一个复选框选中.for(var i = 0; i < aihaos.length; i++){if(aihaos[i].checked){checkedCount++;}}firstChk.checked = (all == checkedCount);/*if(all == checkedCount){firstChk.checked = true;}else{firstChk.checked = false;}*/}}}</script><input type="checkbox" id="firstChk"/><Br><input type="checkbox" name="aihao" value="smoke" />抽烟<Br><input type="checkbox" name="aihao" value="drink" />喝酒<Br><input type="checkbox" name="aihao" value="tt" />烫头<Br></body>
</html>

复选框的全选和取消全选相关推荐

多选框向后台传值，多选框的回显，对多选框的各种操作
1.多选框的回显: js:$( function(){ var checkBoxAll =$("input[name^='checkbox_']");//获取前缀为 ...
C#窗体程序实现全屏及取消全屏步骤
这篇文章主要介绍了C#窗体程序实现全屏及取消全屏步骤,具有很好的参考价值,希望对大家有所帮助.一起跟随小编过来看看吧由于项目需要,需要用vs窗体程序实现播放视频的窗口的全屏和取消全屏. 具体实现界面 ...
DEV控件中GridView中的复选框与CheckBox实现联动的全选功能
最初的界面图如图1-1(全选框ID: cb_checkall DEV控件名称:gcCon ): 要实现的功能如下图(1-2 1-3 1-4)及代码所示: 图1-2 图1-3 图1-4 O(∩_∩ ...
Java复选框怎么取消打钩_jsp实现复选框默认选中，不可取消
在Web开发中,有时候需要显示一些复选框(checkbox),表明这个地方是可以进行勾选操作的,但是有时候是只想告知用户"这个地方是可以进行勾选操作的"而不想让用户在此处勾选(比如 ...
通用样式 -表格的每行的复选框选中打印，清除已勾选
1,在el-table上加单选select2和全选selectAll的方法, 2,增加一列el-table-column <el-table @select="select2" ...
layui复选框怎么取值_layui获取多选框中的值方法
layui获取多选框中的值方法 HTML: title="=$value;?>"> js: $("input:checkbox[name='standard' ...
easyui前端实现多选框_前端：Element UI 多选框组用法笔记
今天给大家分享一下Element UI 多选框组用法笔记,直接上代码! "兴趣爱好:"> "form.checkList"> for= {{item ...
iview 动态控制 table中某一行select勾选框能否选中，以及某一行select勾选框能否显示(隐藏禁用的勾选框)。
如上图,这是一个vue页面中的table,在其columns中加了一个selection后,实现了多选/全选table行的功能: {type: 'selection',width: 60,align: ...
web前端-Vue element UI中的el-table勾选框展示隐藏；设置默认勾选、禁用
1.el-table如果我们想新增一个勾选框,在 .vue文件中 <el-table-column type="selection" width="55" ...
php多选框怎么传值,tp3.2如何处理多选框传参和判断状态
创建多选框: (1)普通的多选: 1 2 3 (2)在数据库中遍历出来的多选框,value和data-id都要赋值(大家都懂,我就不说啦): {$vo.title} 2.我是用jq做的异步,我是使用英 ...

复选框的全选和取消全选

复选框的全选和取消全选

复选框的全选和取消全选相关推荐

最新文章

热门文章