全選復(fù)選框JavaScript編寫小結(jié)（附代碼）

<tr>
     <td>愛&nbsp;&nbsp;好</td>
     <td>
      <label for=""><input type="checkbox" name="fav" id="" value="蘋果" class="btn"/>蘋果</label>
     </td>
     <td>
      <label for=""><input type="checkbox" name="fav" id="" value="香蕉" class="btn"/>香蕉</label>
     </td>
     <td>
      <label for=""><input type="checkbox" name="" id="checkAll" value="全選" class="btn"/>全選</label>
     </td>
    </tr>

var oChkAll = document.getElementById("checkAll");
    //全選
    oChkAll.onclick = function() {
     for(var i = 0; i < oFav.length; i++) {
      oFav[i].checked = this.checked;
     }
    }
    //復(fù)選框組
    for(var i = 0; i < oFav.length; i++) {
     oFav[i].onclick = function() {
      //如果全選
      if(isChkAll()) {
       oChkAll.checked = true;
      } else {
       oChkAll.checked = false;
      }
     }
    }
    //判斷是否全選
    function isChkAll() {
     var all = oFav.length;
     var chk = 0;
     for(var i = 0; i < oFav.length; i++) {
      if(oFav[i].checked) {
       chk++;
      }
     }
     if(all == chk) {
      return true;
     } else {
      return false;
     }
    }

以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助~如果有疑問大家可以留言交流，謝謝大家對億速云的支持!