javaScript选框的全选与取消

2019独角兽企业重金招聘Python工程师标准>>>

<div> <input type="button" value="全选" οnclick="quan()"> <input type="button" value="取消" οnclick="cancel()"> <input type="button" value="反选" οnclick="reverse()"> <table> <thead> <tr> <th>选择</th> <th>主机名</th> <th>端口</th> </tr> </thead>

      <tbody id="tb">
          <tr>
              <td><input type="checkbox"></td>
               <td>1.1.1.1</td>
               <td>11</td>
          </tr>
          <tr>
              <td><input type="checkbox"></td>
               <td>1.1.1.2</td>
               <td>11</td>
          </tr>
        <tr>
               <td><input type="checkbox"></td>
               <td>1.1.1.3</td>
               <td>11</td>
          </tr>
      </tbody>
  </table>

</div>

function quan() { var tb=document.getElementById('tb') var tb_list=tb.children for(var i=0;i<tb_list.length;i++){ var current=tb_list[i] var checkbox= current.children[0].children[0] checkbox.checked=true } } function cancel() { var tb=document.getElementById('tb') var tb_list=tb.children for(var i=0;i<tb_list.length;i++){ var current=tb_list[i] var checkbox= current.children[0].children[0] checkbox.checked=false } }

  function reverse() {
        var tb=document.getElementById('tb')
       var tb_list=tb.children
      for(var i=0;i<tb_list.length;i++){
           var current=tb_list[i]
         var checkbox= current.children[0].children[0]
         if(checkbox.checked==true){
               checkbox.checked=false
         }else{
               checkbox.checked=true
         }
      }
  }

转载于:https://my.oschina.net/u/2511906/blog/1859296