JavaScript 判斷checkbox核取方塊是否選中
本文通過程式碼例項介紹一下如何利用JavaScript判斷核取方塊是否選中。
關於核取方塊更多內容可以參閱HTML input checkbox 核取方塊一章節。
檢測核取方塊是否被選中,就是檢測核取方塊元素物件的checked屬性值是否為true。
程式碼例項如下:
[HTML] 純文字檢視 複製程式碼執行程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <script> window.onload = () => { let odiv=document.getElementById("ant"); let ck=document.getElementById("ck"); let obt=document.getElementById("bt"); obt.onclick= () => { odiv.innerHTML=ck.checked; } } </script> </head> <body> <div id="ant"></div> <input type="checkbox" id="ck" checked/> <input type="button" value="檢視效果" id="bt"/> </body> </html>
程式碼執行效果截圖如下:
嘗試切換核取方塊的選中狀態。然後點選按鈕可以檢視演示效果。
相關文章
- JavaScript獲取選中checkbox核取方塊的選中值JavaScript
- JavaScript 獲取選中checkbox核取方塊的值JavaScript
- js判斷checkbox是否選中JS
- 點選文字選中或取消選中checkbox核取方塊
- checkbox 核取方塊全選程式碼
- HTML input checkbox 核取方塊HTML
- HTML input checkbox核取方塊HTML
- CSS 美化checkbox核取方塊CSS
- jQuery核取方塊checkbox的全選和反選jQuery
- JavaScript 限制核取方塊選中數目JavaScript
- JavaScript 核取方塊全選和全不選JavaScript
- css3美化checkbox核取方塊CSSS3
- JavaScript刪除核取方塊選中的表格行JavaScript
- layui獲取頁面checkbox核取方塊值UI
- JavaScript核取方塊全選和全不選詳解JavaScript
- CSS3 checkbox核取方塊和radio單選框美化效果CSSS3
- 影片直播原始碼,uniapp checkbox 怎麼判斷是否選中原始碼APP
- 直播軟體原始碼,利用uniapp checkbox判斷是否選中原始碼APP
- CSS模擬美化checkbox核取方塊詳解CSS
- checkBox核取方塊,獲得選中那一行所有列的資料
- Flutter 基礎控制元件篇-->單選框(Switch)、核取方塊(Checkbox)Flutter控制元件
- Element原始碼分析系列6-Checkbox(核取方塊)原始碼
- Android 學習筆記之單選按鈕(RadioButton)和核取方塊(CheckBox)Android筆記
- jquery table下的核取方塊選中、取消jQuery
- JavaScript獲取選中checkbox valueJavaScript
- Yii2 中 checkboxlist 核取方塊 預設選中
- 單選按鈕和核取方塊
- jQuery Validate限定核取方塊選中的數目jQuery
- 對於核取方塊的快捷選擇
- 網頁設計實現核取方塊(checkbox)和單選框(radio)對齊的方法網頁
- 小程式核取方塊全選和全部取消
- JavaScript 中,如何判斷兩個物件是否相等?JavaScript物件
- JavaScript 判斷物件中是否有某屬性JavaScript物件
- 基礎元件:單選開關和核取方塊元件
- 使用jQuery做核取方塊的全選與取消jQuery
- JavaScript 判斷是否是陣列JavaScript陣列
- JavaScript 判斷函式是否存在JavaScript函式
- JavaScript判斷字串是否為空JavaScript字串