js点击勾选全部表格表单代码
勾选框全部选择效果:
<form action="###" method="post" name="form1" id="form1" > <div class="main198"> <li><span class="lileft">选项1</span> <span class="liright"> <input type="checkbox" name="id" value="1"> </span></li> <li><span class="lileft">选项2</span> <span class="liright"> <input type="checkbox" name="id" value="2"> </span></li> <li><span class="lileft">选项3</span> <span class="liright"> <input type="checkbox" name="id" value="3"> </span></li> <li><span class="lileft">选项4</span> <span class="liright"> <input type="checkbox" name="id" value="4"> </span></li> <li><span class="lileft">选项5</span> <span class="liright"> <input type="checkbox" name="id" value="5"> </span></li> <li><span class="lileft">选项6</span> <span class="liright"> <input type="checkbox" name="id" value="6"> </span></li> <li><span class="lileft">选项7</span> <span class="liright"> <input type="checkbox" name="id" value="7"> </span></li> <li><span class="lileft">选项8</span> <span class="liright"> <input type="checkbox" name="id" value="8"> </span></li> <li><span class="lileft">选项9</span> <span class="liright"> <input type="checkbox" name="id" value="9"> </span></li> <li><span class="lileft">选项10</span> <span class="liright"> <input type="checkbox" name="id" value="10"> </span></li> </div> <div class="mainbottom"> <input name="chkall" type="checkbox" id="chkall" value="select" onclick=CheckAll(this.form)> 全选</div> </form>
body { font-size: 12px } .main198 { width: 680px; margin: 10px auto } .main198 li { width: 680px; height: 35px; line-height: 35px; padding: 0; margin: 10px auto; border-bottom: #CCC dotted 1px; list-style: none; } .main198 li span.lileft { width: 650px; float: left } .main198 li span.liright { width: 20px; float: right } .mainbottom { width: 680px; margin: 5px auto; text-align: center; }
<script language=JavaScript type=text/JavaScript> function CheckAll(form) { for (var i=0;i<form.elements.length;i++) { var e = form.elements[i]; if (e.name != 'chkall') e.checked = form.chkall.checked; } } </script>
本文作者: Jasmine
本文链接: https://www.jianbaizhan.com/article/42
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 3.0 许可协议。转载请注明出处!