基于JavaScript实现复选框的全选和取消全选

本文实例为大家分享了js复选框的全选和取消全选的具体代码，供大家参考，具体内容如下
效果图：

测试代码如下：

<！DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title></title><style>li{list-style: none;}</style></head><body><div class="first"><ul class="frtInfo"><li class="same"><label><input type="checkbox" name="wp" value="wpa"/>液体</label></li><li class="same"><label><input type="checkbox" name="wp" value="wpb"/>粉末</label></li><li class="same"><label><input type="checkbox" name="wp" value="wpc"/>仿牌</label></li><li class="same"><label><input type="checkbox" name="wp" value="wpd"/>纯电池</label></li><li class="same"><label><input type="checkbox" name="wp" value="wpe"/>危险品</label></li><li class="same"><label><input type="checkbox" name="wp" value="wpd"/>配套电池</label></li><li class="same select"><label><input id="allChecked" class="allChk" type="button" name="sel" value="全选/取消" onclick="selectAllDels（）"/></label></li></ul></div><script src="../js/jquery-1.11.3.js"></script><script type="text/javascript">/*全选或取消全选*/function selectAllDels（）{var allWp=document.getElementsByName（"wp"）;var selOrUnsel=false;for（var i=0; i<allWp.length;i++）{if（allWp[i].checked）{selOrUnsel=true;break;}}if （selOrUnsel）{allUnchk（allWp）;}else{allchk（allWp）;}}function allchk（allWp）{for（var i=0; i<allWp.length;i++ ）{allWp[i].checked=true;}}function allUnchk（allWp）{for（var i=0; i<allWp.length;i++）{allWp[i].checked=false;}}</script></body></html>

直接复制代码可用。
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。