js点击勾选全部表格表单代码

作者:Jasmine - 2015年02月11日

勾选框全部选择效果:

<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 许可协议。转载请注明出处!


 请勿发布不友善或者负能量的内容。审查将对发布广告等违规信息进行处罚!