js實(shí)現(xiàn)全選和全不選
本文實(shí)例為大家分享了js實(shí)現(xiàn)全選和全不選的具體代碼,供大家參考,具體內(nèi)容如下
非常簡潔的幾行原生js實(shí)現(xiàn)全選和全不選,大神們可以在此基礎(chǔ)上加上反選功能。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>全選、全不選</title> </head> <body> <table border="1"> <tr> <td><input type="checkbox" name="mmAll" onclick="All(this, 'mm[]')"></td> </tr> <tr><td><input type="checkbox" value="1" name="mm[]" class="check" id="ids1" onclick="Item(this, 'mmAll')"></td></tr> <tr><td><input type="checkbox" value="2" name="mm[]" class="check" id="ids2" onclick="Item(this, 'mmAll')"></td></tr> <tr><td><input type="checkbox" value="3" name="mm[]" class="check" id="ids3" onclick="Item(this, 'mmAll')"></td></tr> <tr><td><input type="checkbox" value="4" name="mm[]" class="check" id="ids4" onclick="Item(this, 'mmAll')"></td></tr> <tr><td><input type="checkbox" value="5" name="mm[]" class="check" id="ids5" onclick="Item(this, 'mmAll')"></td></tr> <tr><td><input type="checkbox" value="6" name="mm[]" class="check" id="ids6" onclick="Item(this, 'mmAll')"></td></tr> </table> </body> </html> <script type="text/javascript"> //Check all function All(e, itemName) { var aa = document.getElementsByName(itemName); for (var i=0; i < aa.length; i++) aa[i].checked = e.checked; //得到那個(gè)總控的復(fù)選框的選中狀態(tài) } //Single select function Item(e, allName) { var all = document.getElementsByName(allName)[0]; if(!e.checked) all.checked = false; else { var aa =document.getElementsByName(e.name); for (var i=0; i<aa.length; i++) if(!aa[i].checked) return; all.checked= true; } } </script>
效果圖:
更多關(guān)于復(fù)選框的文章請點(diǎn)擊專題:javascript復(fù)選框操作匯總、jquery復(fù)選框操作匯總
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- js實(shí)現(xiàn)全選和全不選功能
- Js實(shí)現(xiàn)復(fù)選框的全選、全不選反選功能代碼實(shí)例
- JS實(shí)現(xiàn)“全選”和"全不選"功能代碼實(shí)例
- 原生JS版和jquery版實(shí)現(xiàn)checkbox的全選/全不選/點(diǎn)選/行內(nèi)點(diǎn)選(Mr.Think)
- JS實(shí)現(xiàn)CheckBox復(fù)選框全選、不選或全不選功能
- js與jQuery實(shí)現(xiàn)checkbox復(fù)選框全選/全不選的方法
- JS實(shí)現(xiàn)CheckBox復(fù)選框全選全不選功能
- 使用js如何實(shí)現(xiàn)全選與全不選
- jquery全選/全不選/反選另一種實(shí)現(xiàn)方法(配合原生js)
- JavaScript實(shí)現(xiàn)全選和全不選操作
相關(guān)文章
JS?中數(shù)組的增刪改查和對(duì)象的增刪改查實(shí)例詳解
這篇文章主要介紹了JS?中數(shù)組的增刪改查和對(duì)象的增刪改查實(shí)例詳解,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-07-07js通過iframe加載外部網(wǎng)頁的實(shí)現(xiàn)代碼
這篇文章主要介紹了js通過iframe加載外部網(wǎng)頁的實(shí)現(xiàn)代碼,需要的朋友可以參考下2015-04-04js arguments,jcallee caller用法總結(jié)
這篇文章主要介紹了js中arguments, jcallee caller用法。需要的朋友可以過來參考下,希望對(duì)大家有所幫助2013-11-11Uni-app跨平臺(tái)開發(fā)應(yīng)用入門實(shí)戰(zhàn)
這篇文章主要為大家介紹了Uni-app跨平臺(tái)開發(fā)應(yīng)用入門實(shí)戰(zhàn)示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-03-03JavaScript 斐波那契數(shù)列 倒序輸出 輸出100以內(nèi)的質(zhì)數(shù)代碼實(shí)例
這篇文章主要介紹了JavaScript 斐波那契數(shù)列 倒序輸出 輸出100以內(nèi)的質(zhì)數(shù)代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-09-09JavaScript中各種時(shí)間轉(zhuǎn)換問題詳解(YYYY-MM-DD、時(shí)間戳、中國標(biāo)準(zhǔn)時(shí)間)
在某些場景下,需要將時(shí)間轉(zhuǎn)換為字符串進(jìn)行展示或傳遞,下面這篇文章主要給大家介紹了關(guān)于JavaScript中各種時(shí)間轉(zhuǎn)換問題(YYYY-MM-DD、時(shí)間戳、中國標(biāo)準(zhǔn)時(shí)間)的相關(guān)資料,需要的朋友可以參考下2024-02-02