当前位置:网站首页>How to determine whether the checkbox in JS is selected
How to determine whether the checkbox in JS is selected
2022-07-07 16:11:00 【Daxiong who loves learning】
In the process of learning, I touch html Content of separate development , Check box checkbox It is determined that the selection is for ajax It is very important to transmit data , So forward this article for retention , For future reference .
To determine whether the check box is selected, you can use :
$("#test1").prop("checked") and $("#test1").is(":checked")1
1、checkbox Medium checked attribute
1.1 If for input label , Do not set its checked Attribute words , The default is that the check box is not selected ;
<input type="checkbox" name="test" id="test"/> // Not selected 1
1.2 And if you set it checked Attribute words , I am js In the middle of the test ;
1) take checked Property is set to checked=true perhaps checked=”true” perhaps checked=”false” when , The system will think that the check box is selected .
<input type="checkbox" name="test" id="test1"/ checked=true> // Choose
<input type="checkbox" name="test" id="test2"/ checked="true"> // Choose
<input type="checkbox" name="test" id="test3"/ checked="false"> // Choose
<input type="checkbox" name="test" id="test4"/ checked > // Choose 1234
2) During the test , take checked Property is set to checked=false when , The system still thinks that the check box is not selected ;
<input type="checkbox" name="test" id="test5"/ checked=false> // Not selected 1
*** however , When we will checked Property is set to checked=false when , Although at the time of display , The check box is not selected when it is rendered , however , If we use the following code :
$("#test").prop("checked") as well as $("#test").is(":checked")1
The value obtained is still true( Choose ).
2、 Use (.val()) Value —– It can't be used to judge whether the check box is selected
<input type="checkbox" name="test" id="test"/> // Not selected
<input type="checkbox" name="test" id="test1"/ checked=true> // Choose 12
We use console.log() take checked Print out the value of , The result is as follows :
Whether it is selected or not , The values taken are on, So we have to decide checkbox Selected state of , Out of commission .val() Value
console.log($("#test").val()) // Print out on
console.log($("#test1").val()) // Print out on12
3、 Use (.attr()) Take the attribute value —– It can't be used to judge whether the check box is selected
<input type="checkbox" name="test" id="test"/> // Not selected
<input type="checkbox" name="test" id="test1"/ checked> // Choose 12
We use console.log() take checked Print out the value of , The result is as follows :
Whether it is selected or not , The values taken are undefine, So we have to decide checkbox Selected state of , Out of commission .attr() Value
1
console.log($("#test").attr()) // Print out undefine
console.log($("#test1").attr()) // Print out undefine12
4、 Use (.prop()) Get current status —— It can be used to judge whether the check box is selected
<input type="checkbox" name="test" id="test"/> // Not selected
<input type="checkbox" name="test" id="test1"/ checked> // Choose 12
We use console.log() take checked Print out the value of , The result is as follows :
The selected status will get true, If it is not selected, you will get false, So we have to decide checkbox Selected state of , have access to .prop() Value
onsole.log($("#test").prop("checked")) // Print out false
console.log($("#test1").prop("checked")) // Print out true12
5、 Use (.is())—- It can be used to judge whether the check box is selected
<input type="checkbox" name="test" id="test"/> // Not selected
<input type="checkbox" name="test" id="test1"/ checked> // Choose 12
Use $(“input[type=’checkbox’]”).is(‘:checked’) sentence , By using console.log() take checked Print out the value of , The result is as follows :
The selected status will get true, If it is not selected, you will get false, So we have to decide checkbox Selected state of , have access to .is() Value
console.log($("#test").is(":checked")) // Print out false
console.log($("#test1").is(":checked")) // Print out true
边栏推荐
- Mesh merging under ue4/ue5 runtime
- Talk about the cloud deployment of local projects created by SAP IRPA studio
- 2022 the 4th China (Jinan) International Smart elderly care industry exhibition, Shandong old age Expo
- Excessive dependence on subsidies, difficult collection of key customers, and how strong is the potential to reach the dream of "the first share of domestic databases"?
- VS2005 strange breakpoint is invalid or member variable value cannot be viewed
- leetcode 241. Different ways to add parentheses design priority for operational expressions (medium)
- Three. JS introductory learning notes 07: external model import -c4d to JSON file for web pages -fbx import
- 航運船公司人工智能AI產品成熟化標准化規模應用,全球港航人工智能/集裝箱人工智能領軍者CIMC中集飛瞳,打造國際航運智能化標杆
- 招标公告:盘锦市人民医院盘锦医院数据库维保项目
- How to implement backspace in shell
猜你喜欢
Three. JS introductory learning notes 18: how to export JSON files with Blender
Lecturer solicitation order | Apache seatunnel (cultivating) meetup sharing guests are in hot Recruitment!
Enterprise log analysis system elk
喜讯!科蓝SUNDB数据库与鸿数科技隐私数据保护管理软件完成兼容性适配
LeetCode2_ Add two numbers
Wireless sensor networks -- ZigBee and 6LoWPAN
Odoo集成Plausible埋码监控平台
SPI master RX time out interrupt
SPI master rx time out中断
Multiplication in pytorch: mul (), multiply (), matmul (), mm (), MV (), dot ()
随机推荐
Shandong old age Expo, 2022 China smart elderly care exhibition, smart elderly care and aging technology exhibition
Shipping companies' AI products are mature, standardized and applied on a large scale. CIMC, the global leader in port and shipping AI / container AI, has built a benchmark for international shipping
Three. JS introductory learning notes 10:three JS grid
Xcode Revoke certificate
Notification uses full resolution
一个普通人除了去工厂上班赚钱,还能干什么工作?
MySQL数据库基本操作-DQL-基本查询
markdown公式编辑教程
Step by step monitoring platform ZABBIX
torch. Numel action
Particle effect for ugui
Mesh merging under ue4/ue5 runtime
Enterprise log analysis system elk
Three. JS introductory learning notes 18: how to export JSON files with Blender
C Alibaba cloud OSS file upload, download and other operations (unity is available)
统计学习方法——感知机
Summary of knowledge points of xlua hot update solution
The "go to definition" in VS2010 does not respond or prompts the solution of "symbol not found"
Apache Doris just "graduated": why should we pay attention to this kind of SQL data warehouse?
Limit of total fields [1000] in index has been exceeded