JS實作CheckBox複選框全選全不選功能_javascript技巧
May 16, 2016 pm 04:00 PM
全不選
全選
CheckBox控制項就是我們一般所說的複選框,通常用於某個選項的開啟或關閉。大多數應用程式的「設定」對話方塊內均有此控制項。我們看到的可以打勾的就是CheckBox。
此控制項表示一個特定的狀態(即選項)是選定 (on,值為1) 或清除 (off,值為0)。在應用程式中使用該控制項為使用者提供「True/False」或「yes/no」的選擇。因為 CheckBox 彼此獨立工作,所以使用者可以同時選擇任意多個 CheckBox,進行選項組合。
CheckBox複選框JS實作全選全不選功能,很簡單,就只要插入一小段js函數就行了。 。 。
<script language="javascript"> function cli(Obj) { var collid = document.getElementByIdx_x("all") var coll = document.getElementsByName(Obj) if (collid.checked){ for(var i = 0; i < coll.length; i++) coll[i].checked = true; }else{ for(var i = 0; i < coll.length; i++) coll[i].checked = false; } } </script>
登入後複製
下面是一組CheckBox複選框html程式碼
<input name='多选项名称' type='checkbox' value='' id="all" onclick="cli('多选项名称');"> 全选 <input name='多选项名称' type='checkbox' value='' > A <input name='多选项名称' type='checkbox' value='' > B <input name='多选项名称' type='checkbox' value='' > C <input name='多选项名称' type='checkbox' value='' > D <input name='多选项名称' type='checkbox' value='' > E <input name='多选项名称' type='checkbox' value='' > F
登入後複製
好了,你可以複製一下以上的程式碼,修改測試一下。 。 。
以上所述就是本文的全部內容了,希望大家能夠喜歡。
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱門文章
兩個點博物館:邦格荒地地點指南
4 週前
By 尊渡假赌尊渡假赌尊渡假赌
擊敗分裂小說需要多長時間?
3 週前
By DDD
倉庫:如何復興隊友
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗?
3 週前
By 王林

熱門文章
兩個點博物館:邦格荒地地點指南
4 週前
By 尊渡假赌尊渡假赌尊渡假赌
擊敗分裂小說需要多長時間?
3 週前
By DDD
倉庫:如何復興隊友
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗?
3 週前
By 王林

熱門文章標籤

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)