首页 > 数据库技术 > 详细

实现table中checkbox复选框、以及判断checked是否被选中、js操作checkedbox选中

时间:2016-10-17 20:36:37      阅读:693      评论:0      收藏:0      [点我收藏+]

技术分享

 

上图是实现效果。

下面贴代码

表的第一行也就是<th>中的代码,onclick事件是实现全选或者全不选效果。

<th>
<input id="allboxs" onclick="allcheck()" type="checkbox"/>
</th>

td中的代码

<td>
<input  name="boxs" type="checkbox"/>
</td>

js中实现全选、全不选效果

function allcheck() {
             var nn = $("#allboxs").is(":checked"); //判断th中的checkbox是否被选中,如果被选中则nn为true,反之为false
                 if(nn == true) {
                     var namebox = $("input[name^=‘boxs‘]");  //获取name值为boxs的所有input
                     for(i = 0; i < namebox.length; i++) {
                         namebox[i].checked=true;    //js操作选中checkbox
                     }
                 }
                 if(nn == false) {
                     var namebox = $("input[name^=‘boxs‘]");
                     for(i = 0; i < namebox.length; i++) {
                         namebox[i].checked=false;
                     }
                 }
             }

 

以上代码值得一提的是,获取checkbox的值或其他的什么,建议用name属性值操作,因为id属性在每一个页面中默认是唯一的,而name属性则可以取到属性值相同的所有。

 

实现table中checkbox复选框、以及判断checked是否被选中、js操作checkedbox选中

原文:http://www.cnblogs.com/guokai870510826/p/5970852.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!