广州凡科互联网科技有限公司

营业时间
MON-SAT 9:00-18:00

全国服务热线
18720358503

公司门店地址
广州市海珠区工业大道北67号凤凰创意园

厦门微信小程序开发_js/jQuery完成全选效果

日期:2021-01-07 浏览:
js/jQuery实现全选效果       这篇文章主要为大家详细介绍了js/jQuery两种代码实现全选效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了js/jQuery两种代码实现全选效果的具体代码,供大家参考,具体内容如下

注意点

在获取子选框的时候别加上 全选框的个数了

技巧

找 tbody 下面的input标签 就可以

jq文件夹自己下载即可

思路

var all=my$("j_tb").getElementsByTagName("input");
 // alert(all.length);
 //实现1 点击全选 子选框都得被全选
 * 点击全选框 判断全选框的checked是否为真 为真 遍历所有子选框 设置所有子选框的checked=true; true不用加""
 my$("j_cbAll"). unction(){
 if(j_cbAll.checked)
 for(var i=0;i all.length;i++)
 all[i].checked=true;
 else{
 for(var i=0;i all.length;i++)
 all[i].checked=false;
 //实现2 选择所有的子选框 全选框勾选
 var arr=[];
 for(var i=0;i all.length;i++)
 all[i]. unction(){
 //思路过程
 /** 
 * 创建数组
 * 点击每个子选框 
 * 1.数组清零
 * 2.fou循环所有自选框 判断是否被选中(all[i].checked) 选中的元素加入新的数组(arr.push(all[i]))里面
 * 3.判断新的数组长度是否等于子选框数组长度 是的话 全选框被选中(my$("j_cbAll").checked=true) 否则相反
 arr=[];
 for(var i=0;i all.length;i++)
 if(all[i].checked)
 arr.push(all[i]);

//修改下面的哪些checkbox $("#j_tb input").prop("checked", $(this).prop("checked"));//根据自己来判断是否全选与否 $("#j_tb input").click(function () { if($("#j_tb input:checked").length == $("#j_tb input").length){ $("#j_cbAll").prop("checked", true) }else { $("#j_cbAll").prop("checked", false) /script

* 点击全选框 判断全选框的checked是否为真 为真 遍历所有子选框 设置所有子选框的checked=true; true不用加"" my$("j_cbAll"). unction(){ if(j_cbAll.checked) for(var i=0;i all.length;i++) all[i].checked=true; else{ for(var i=0;i all.length;i++) all[i].checked=false; //实现2 选择所有的子选框 全选框勾选 var arr=[]; for(var i=0;i all.length;i++) all[i]. unction(){ //思路过程 /** * 创建数组 * 点击每个子选框 * 1.数组清零 * 2.fou循环所有自选框 判断是否被选中(all[i].checked) 选中的元素加入新的数组(arr.push(all[i]))里面 * 3.判断新的数组长度是否等于子选框数组长度 是的话 全选框被选中(my$("j_cbAll").checked=true) 否则相反 arr=[]; for(var i=0;i all.length;i++) if(all[i].checked) arr.push(all[i]);
//修改下面的哪些checkbox $("#j_tb input").prop("checked", $(this).prop("checked"));//根据自己来判断是否全选与否 $("#j_tb input").click(function () { if($("#j_tb input:checked").length == $("#j_tb input").length){ $("#j_cbAll").prop("checked", true) }else { $("#j_cbAll").prop("checked", false) /script /body /html

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持凡科。




新闻资讯

联系方式丨CONTACT

  • 全国热线:18720358503
  • 传真热线:18720358503
  • Q Q咨询:2639601583
  • 企业邮箱:2639601583@qq.com

首页
电话
短信
联系