《jQuery判断radio、checkbox、select 是否选中和设置选中问题以及获取选中值》总结
<form>
<input type="radio" name="gender" id="man" value="男" />男
<input type="radio" name="gender" id="woman" value="女" />女
<br />
<input type="checkbox" name="math" id="math"/>数学
<input type="checkbox" name="english" id="english"/>英语
<input type="checkbox" name="chinese" id="chinese"/>语文
<br />
<select id="province">
<option value="beijing">北京</option>
<option value="hubei">湖北省</option>
<option value="hunan">湖南省</option>
<option value="guangdong">广东省</option>
</select>
<input id="btnSubmit" type="submit" value="submit" />
</form>
1. 判断radio是否被选中:
//可以通过判断radio被选中的个数长度是否为0
var len = $('input[name="gender"]:checked').length;
if(len){
console.log('radio没有选择,请选择一个!');
}
//判断某个radio是否被选中
if($('#man:checked').length){
console.log('你选择了男的radio');
}
//或者
if($('#man').is(':checked')){
console.log('你选择了男的radio');
}
2. 设置radio选中:
//javascript方法:
document.getElementById("man").checked = true;
//jQuery的prop方法
$('#man').prop('checked', true);
//取消选中
$('#man').prop('checked', false);
//不建议使用以下方法
$('#man').attr('checked', true);
3. 获取radio被选中的值
$('input[name="gender"]:checked').val();
//或者
$('input[name="gender"][checked]').val();
4. 判断checkbox是否被选中:
//判断某个checkbox是否被选中,跟radio方法一样
if($('#math:checked').length){
console.log('你选择了数学');
}
//或者
if($('input[name="math"]:checked').length){
console.log('你选择了数学');
}
//或者
if($('#math').is(':checked')){
console.log('你选择了数学');
}
//还有一种方法是使用javascript
if(document.getElementById("math").checked == true){
console.log('你选择了数学');
}
//注意:网上流传的如下这种判断方法是不恰当的,与jQuery版本有关
if($('#math').attr('checked') == true)
if($('#math').attr('checked') == undefined)
if($('#math').attr('checked') == 'checked')
5. 设置checkbox选中:
/***跟radio的方法一样***/
//javascript方法:
document.getElementById("math").checked = true;
//jQuery的prop方法
$('#math').prop('checked', true);
//取消选中
$('#math').prop('checked', false);
//不建议使用以下方法
$('#math').attr('checked', true);
6. select的取值、选中
//获取当前选中项的值
$("#province").val();
//获取当前选中项的text
$("#province").find("option:selected").text();
//设置value值为guangdong的项选中
$("#province").val('guangdong');
//设置text为广东的项选中
$(".selector").find("option[text='广东']").attr("selected",true);
《jQuery判断radio、checkbox、select 是否选中和设置选中问题以及获取选中值》总结的更多相关文章
- 《FLASH PROGRAMMING 那些事》总结
注明来自 http://www.ssdfans.com/?p=5589 以MLC为例: 对FGF(Floating Gate Flash)技术的,MLC programming一般分两步走:先prog ...
- Implementation of Serial Wire JTAG flash programming in ARM Cortex M3 Processors
Implementation of Serial Wire JTAG flash programming in ARM Cortex M3 Processors The goal of the pro ...
- [原创] Keil uVision5 下载程序 add flash programming algorithm选项缺少需要的算法解决办法
MDK开发环境从V4升级到V5后,支持包不再是集成到开发环境当中,而是封装在PACK中,需要自行安装,比较麻烦. 搭建MDK开发环境以及破解的方法,在前面的文章中有详细说明,这里不再赘述,有兴趣的可以 ...
- Turtelizer 2 provide JTAG Flash programming and debugging of ARM based boards via USB
http://www.ethernut.de/en/hardware/turtelizer/ Introducing Turtelizer 2 Overview Turtelizer 2 had be ...
- 痞子衡嵌入式:恩智浦i.MX RT1xxx系列MCU硬件那些事(2.3)- 串行NOR Flash下载算法(J-Link工具篇)
大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是J-Link工具下i.MXRT的串行NOR Flash下载算法设计. 在i.MXRT硬件那些事系列之<在串行NOR Flash X ...
- Programming Internal Flash Over the Serial Wire Debug <SWD> Interface -- EFM32
1 Debug Interface Overview 1.1 Serial Wire Debug Serial Wire Debug (SWD) is a two-wire protocol for ...
- Error:Flash Download Failed-"Cortex-M3"
Error:Flash Download Failed-"Cortex-M3"出现一般有两种情况: 1.SWD模式下,Debug菜单中,Reset菜单选项(Autodetect/H ...
- STM32F4读写内部FLASH【使用库函数】
STM32F4Discovery开发帮使用的STM32F407VGT6芯片,内部FLASH有1M之多.平时写的代码,烧写完之后还有大量的剩余.有效利用这剩余的FLASH能存储不少数据.因此研究了一下S ...
- Flash Download Failed-"Cortex-M3"
rror:Flash Download Failed-"Cortex-M3"出现一般有两种情况: 1.SWD模式下,Debug菜单中,Reset菜单选项(Autodetect/HW ...
- Stm32_调试出现 Error:Flash Download Failed-"Cortex-M3"
rror:Flash Download Failed-"Cortex-M3"出现一般有两种情况: 1.SWD模式下,Debug菜单中,Reset菜单选项(Autodetect/HW ...
随机推荐
- 谈c++ pb_ds库(二) 红黑树大法好
厉害了,没想到翻翻pb_ds库看到这么多好东西,封装好的.现成的splay.红黑树.avl... 即使不能在考场上使用也可以用来对拍哦 声明/头文件 #include <ext/pb_ds/tr ...
- css动画
阅读目录 css3中与动画相关的标签 animation transition 与动画无关的transform 浏览器兼容 css3中与动画相关的标签 1.animation标签 不同浏览器的动画属性 ...
- 【原】Spark之机器学习(Python版)(一)——聚类
kmeans聚类相信大家都已经很熟悉了.在Python里我们用kmeans通常调用Sklearn包(当然自己写也很简单).那么在Spark里能不能也直接使用sklean包呢?目前来说直接使用有点困 ...
- FPGA与simulink联合实时环路系列——实验二LED
实验二LED 实验内容 在实验一的基础上,将simulink产生的测试信号输出到FPGA开发板上的LED灯进行显示,这里要在生成的硬件模型上进行修改,将传送到FPGA的信号输出到8个LED灯上,并且对 ...
- Pairwise Sum and Divide 51nod
1305 Pairwise Sum and Divide 题目来源: HackerRank 基准时间限制:1 秒 空间限制:131072 KB 分值: 5 难度:1级算法题 收藏 关注 有这样 ...
- CentOS升级openssl
才设置了http2,结果蓝狗说我网站不安全,检测一下发现openssl有漏洞,于是准备升级一下openssl 检测网站: www.ssllabs.com/ssltest/analyze.html # ...
- 3d图片切换(css3帧动画)
效果带抖动翻转隐藏,使用帧动画 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"&g ...
- 【转】MipMap
原文地址http://www.cppblog.com/wc250en007/archive/2011/08/06/152653.html 首先从MIPMAP的原理说起,它是把一张贴图按照2的倍数进行缩 ...
- python爬乌云dorps文章
有时候翻看drops 无赖drops没有一个全部文章列表,所以就有了这个想法把所有文件标题链接都爬出来这样又直观又好找感兴趣的文章 #coding=utf-8 import re import url ...
- 【汉字】转【pīnyīn】
引言 github地址:aizuyan/pinyin 无意中看到了overtrue/pinyin这个项目,感觉很有意思, 这个项目做了这么一件事情: 将汉字转化为拼音 刚看到这里是不是觉得没什么难度, ...