全选反选的html的代码,jquery实现全选、反选、取消全选功能代码

li{

font-size: 16px; list-style:none; height:30px;

}

• 1.中文网页设计

• 2.网页制作

• 3.建站之家

• 4.网站爱好者

• 5.网页设计论坛

• 6.网页制作社区

$(function(){

//全选或全不选

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

if(this.checked){

$("#list :checkbox").attr("checked",true);

}else{

$("#list :checkbox").attr("checked",false);

}

});

//全选

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

$("#list :checkbox,#all").attr("checked",true);

});

//全不选

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

$("#list :checkbox,#all").attr("checked",false);

});

//反选*****

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

$("#list :checkbox").each(function(){

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

});

allchk();

});

//设置全选复选框

$("#list :checkbox").click(function(){

allchk();

});

});

function allchk(){

var chknum = $("#list :checkbox").size();//选项总个数

var chk =0;

$("#list :checkbox").each(function(){

if($(this).attr("checked")==true){

chk++;

}

});

if(chknum==chk){//全选

$("#all").attr("checked",true);

}else{//不全选

$("#all").attr("checked",false);

}

}

提示：你可以先修改部分代码再运行。