您的位置：首页 > Web前端 > JQuery

jquery实现checkbox全选，反选，取消选择

2014-01-02 15:32 323 查看
转自：http://blog.sina.com.cn/s/blog_5a08b1780100duqx.html

<a href="javascript:;" id="all">全部选择</a><br>

<a href="javascript:;" id="delAll">取消选择</a><br>

<a href="javascript:;" id="antiAll">反向选择</a>

<p><input type="checkbox" name="checkbox1">A

<input type="checkbox" name="checkbox1"> B

<input type="checkbox" name="checkbox1">C</p>

<p><input type="checkbox" name="checkbox1">D

<input type="checkbox" name="checkbox1">E

<input type="checkbox" name="checkbox1">F</p>
全部选择代码：

Jquery部分

//全部选择

$("#all").click(function(){

$("input[name='checkbox1']").each(function(){

$(this).attr("checked",true);

});

});

普通javascirpt部分：

function checkAll(){

for(i=0;i<newTask.length;i++){

e=newTask.elements[i];

if(e.type=='checkbox'){

if(e.checked=false){

e.checked=true;

}else{

e.checked=true;

}

}

}

}
取消选择代码:

Jquery部分：

//取消选择

$("#delAll").click(function(){

$("input[name='checkbox1']").each(function(){

$(this).attr("checked",false);

});

});

普通javascript部分：

function delAll(){

for(i=0;i<newTask.length;i++){

e=newTask.elements[i];

if(e.type=='checkbox'){

if(e.checked=true){

e.checked=false;

}

else{

e.checked=false;

}

}

}

}
反向选择代码：

Jquery部分：

//反向选择

$("#antiAll").click(function(){

$("input[name='checkbox1']").each(function(){

$(this).attr("checked",!this.checked);

});

普通javascript部分：

function antiAll(){

for(i=0;i<newTask.length;i++){

e=newTask.elements[i];

if(e.type=='checkbox'){

e.checked=!e.checked;

}

}

}
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航