1. 程式人生 > >如何利用jQuery使複選框一鍵全選/全不選

如何利用jQuery使複選框一鍵全選/全不選

  我們先寫一個表單:

<form>
你愛好的運動是?
<input type="checkbox"  id="hxy"/>全選/不全選
<br />
<input type="checkbox" name="hxy" />1
<input type="checkbox" name="hxy" />2
<input type="checkbox" name="hxy"/>3
<input type="checkbox" name="hxy" />4
</form>

在第一個複選框中新增click()事件,

核心的jQuery程式碼如下:

<script type="text/javascript">
$(document).ready(function(e) {
$("#hxy").click(function(){
if(this.checked){
    $("[name=hxy]").attr("checked",true);}
else{ $("[name=hxy]").attr("checked",false);}
});
});
</script>

這樣就完成了一個最基本的全選/全不選的例項。

結果: