码迷,mamicode.com
首页 > Web开发 > 详细

input 全选 jquery封装方法

时间:2018-03-17 19:46:49      阅读:502      评论:0      收藏:0      [点我收藏+]

标签:调用   复选框   win   select   选中   checked   jquer   tab   box   

HTML代码
<table class="table table-striped">
<thead>
<tr>
<th><input type="checkbox" class="selBtn"/></th>
</tr>
</thead>
<tbody>
     <tr><td style="width: 5%"><input type="checkbox" class="s1"/></td></tr>
 </tbody>
</table>
//封装之后的全选
window.onload=function(){
//调用插件方法
SelectPlugin(‘selBtn‘);
}
function SelectPlugin(classname){

var objs=document.getElementsByClassName(classname);
for (var i = 0; i < objs.length; i++) {
//这用闭包 不用闭包会有问题
~function(ind){
var obj=objs[ind];
obj.onclick=function(){
var sonInputsParent= obj.parentNode.parentNode.parentNode.nextElementSibling;//所有需要跟着选中的input的父节点
var sonInputs=sonInputsParent.getElementsByClassName(‘s1‘);//如果没有其他的复选框可以用getElementsByTagName;
for (var j = 0; j < sonInputs.length; j++) {
var inputObj = sonInputs[j];
inputObj.checked=obj.checked;
}
}
}(i);
}
}


input 全选 jquery封装方法

标签:调用   复选框   win   select   选中   checked   jquer   tab   box   

原文地址:https://www.cnblogs.com/supershare/p/8591860.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!