jquery實現checkbox全選，反選，取消選擇

jquery實現checkbox全選，反選，取消選擇

開門見山，直接介紹方法，假設頁面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;

 }

}

}