大家在製作HTML網頁時可能會需要使用到按下「全選」後選擇所有的Checkbox,所以今天就來叫大家如何使用jQuery來實現Checkbox全選的功能
教學
1、首先在你需要出現全選的地方加入下列代碼
1 |
<input type="checkbox" name="checkbox_name[]" id="all" value="all"> |
注意:注意將 checkbox_name[]
改成你其他Checkbox的名稱,同時也需要在JS內修改
2、加入jQuery代碼
1 2 3 4 5 |
$(function() { $('#all').click(function(){ $("input[name='checkbox_name[]'").prop("checked",$(this).prop("checked")); }); }); |
3、這樣你只需要按下那個Checkbox就可以自動勾選上所有的Checkbox啦!
預覽