一、效果演示
請選擇你所掌握的語言:
全選/全不選
Java JavaScript php Python
二、源碼展示
<script type="application/javascript"> $().ready(function(){ //選擇所有的input類型為checkbox且name="items",通過attr改變其checked屬性 $("#checkItems").click(function(){ if($(this).attr("checked")){ $(":checkbox[name='items']").attr("checked",true); }else{ $(":checkbox[name='items']").attr("checked",false); } }); //選擇所有的input類型為checkbox且name="items",遍歷每一項將其取反 $("#check_reversal").click(function(){ $(":checkbox[name='items']").each(function(){ if($(this).attr("checked")){ $(this).attr("checked",false); }else{ $(this).attr("checked",true) } }); }); }); </script> <body> 請選擇你所掌握的語言: <br> <input type="checkbox" name="checkItems" id="checkItems" value="全選/全不選"/>全選/全不選 <br/> <input type="checkbox" name="items" value="Java" />Java <input type="checkbox" name="items" value="JavaScript"/>JavaScript <input type="checkbox" name="items" value="php"/>php <input type="checkbox" name="items" value="Python"/>Python <br/> <input type="button" name="checkall" id="check_reversal" value="反選" /> </body>
三、總結
$(this):代表當前對象。
