您好,登錄后才能下訂單哦!
對于全選框的操作分為兩種情況:
1.單擊全選框,下面全部選中
2.單擊下面的復選框,全部點擊上,全選框被選中,否則全選框沒有選中。
html樣式
<tr> <td>愛 好</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>
js樣式
var oChkAll = document.getElementById("checkAll"); //全選 oChkAll.onclick = function() { for(var i = 0; i < oFav.length; i++) { oFav[i].checked = this.checked; } } //復選框組 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; } }
以上就是這篇文章的全部內容了,希望本文的內容對大家的學習或者工作能帶來一定的幫助~如果有疑問大家可以留言交流,謝謝大家對億速云的支持!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。