javaScript實現(xiàn)復(fù)選框全選反選事件詳解
本文實例為大家分享了javaScript實現(xiàn)復(fù)選框全選反選的具體代碼,供大家參考,具體內(nèi)容如下
代碼
<html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <title></title> <script> window.onload=function(){ var selAll=document.getElementById("selAll"); var hobbys=document.getElementsByName("hobby"); var fx=document.getElementById("fx"); var myClick=document.getElementById("xz"); function myClick(){ alert("hello"); } //全選事件 selAll.onclick=function(){ if(selAll.checked == true){ for ( var i=0; i<hobbys.length; i++) { hobbys[i].checked=true; } }else{ for ( var i=0; i<hobbys.length; i++) { hobbys[i].checked=false; } } } //反選事件 fx.onclick=function(){ for (var i=0; i<hobbys.length; i++) { var b=hobbys[i]; if (b.checked == true) { b.checked=false }else{ b.checked=true; } } } } </script> </head> <body> <span onclick="myClick()" id="xz"><input type="checkbox" id="selAll"/>全選</span> <button id="fx">反選</button></br> <input type="checkbox" name="hobby" />羽毛球 <input type="checkbox" name="hobby"/>繪畫 <input type="checkbox" name="hobby"/>唱歌 <input type="checkbox" name="hobby"/>跳舞 </body> </html>
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
TypeScript聯(lián)合類型,交叉類型和類型保護
這篇文章主要介紹了TypeScript聯(lián)合類型,交叉類型和類型保護,聯(lián)合類型就是定義一些類型,定義的變量只需要滿足任意一種類型即可,交叉類型就是需要滿足所有類型,交叉類型使用,更多內(nèi)容我們來看看下面文章詳細內(nèi)容吧2021-12-12JavaScript實現(xiàn)點擊單選按鈕改變輸入框中文本域內(nèi)容的方法
這篇文章主要介紹了JavaScript實現(xiàn)點擊單選按鈕改變輸入框中文本域內(nèi)容的方法,涉及javascript單選按鈕控制頁面元素樣式的相關(guān)技巧,非常簡單實用,需要的朋友可以參考下2015-08-08setTimeout 函數(shù)在前端延遲搜索實現(xiàn)中的作用詳解
這篇文章主要為大家介紹了setTimeout 函數(shù)在前端延遲搜索實現(xiàn)中的作用詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-12-12js根據(jù)手機客戶端瀏覽器類型,判斷跳轉(zhuǎn)官網(wǎng)/手機網(wǎng)站多個實例代碼
這篇文章主要介紹了js根據(jù)手機客戶端瀏覽器類型,判斷跳轉(zhuǎn)官網(wǎng)/手機網(wǎng)站多個實例代碼,需要的朋友可以參考下2016-04-04bootstrap fileinput組件整合Springmvc上傳圖片到本地磁盤
這篇文章主要介紹了bootstrap fileinput組件整合Springmvc上傳圖片到本地磁盤的方法,需要的朋友可以參考下2017-05-05微信小程序開發(fā)之a(chǎn)nimation循環(huán)動畫實現(xiàn)的讓云朵飄效果
這篇文章主要介紹了微信小程序開發(fā)之a(chǎn)nimation循環(huán)動畫實現(xiàn)的讓云朵飄效果,結(jié)合實例形式分析了animation結(jié)合js時間函數(shù)實現(xiàn)循環(huán)動畫效果的具體步驟與相關(guān)操作技巧,需要的朋友可以參考下2017-07-07網(wǎng)絡(luò)之美 JavaScript中Get和Set訪問器的實現(xiàn)代碼
前兩天IE9 Beta版發(fā)布了,對于從事Web開發(fā)的朋友們來說真是個好消息啊,希望將來有一天各個瀏覽器都能遵循統(tǒng)一的標準。今天要和大家分享的是JavaScript中的Get和Set訪問器,和C#中的訪問器非常相似。2010-09-09