<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 是否选中和设置选中问题以及获取选中值》总结的更多相关文章

  1. 《FLASH PROGRAMMING 那些事》总结

    注明来自 http://www.ssdfans.com/?p=5589 以MLC为例: 对FGF(Floating Gate Flash)技术的,MLC programming一般分两步走:先prog ...

  2. 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 ...

  3. [原创] Keil uVision5 下载程序 add flash programming algorithm选项缺少需要的算法解决办法

    MDK开发环境从V4升级到V5后,支持包不再是集成到开发环境当中,而是封装在PACK中,需要自行安装,比较麻烦. 搭建MDK开发环境以及破解的方法,在前面的文章中有详细说明,这里不再赘述,有兴趣的可以 ...

  4. 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 ...

  5. 痞子衡嵌入式:恩智浦i.MX RT1xxx系列MCU硬件那些事(2.3)- 串行NOR Flash下载算法(J-Link工具篇)

    大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是J-Link工具下i.MXRT的串行NOR Flash下载算法设计. 在i.MXRT硬件那些事系列之<在串行NOR Flash X ...

  6. 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 ...

  7. Error:Flash Download Failed-"Cortex-M3"

    Error:Flash Download Failed-"Cortex-M3"出现一般有两种情况: 1.SWD模式下,Debug菜单中,Reset菜单选项(Autodetect/H ...

  8. STM32F4读写内部FLASH【使用库函数】

    STM32F4Discovery开发帮使用的STM32F407VGT6芯片,内部FLASH有1M之多.平时写的代码,烧写完之后还有大量的剩余.有效利用这剩余的FLASH能存储不少数据.因此研究了一下S ...

  9. Flash Download Failed-"Cortex-M3"

    rror:Flash Download Failed-"Cortex-M3"出现一般有两种情况: 1.SWD模式下,Debug菜单中,Reset菜单选项(Autodetect/HW ...

  10. Stm32_调试出现 Error:Flash Download Failed-"Cortex-M3"

    rror:Flash Download Failed-"Cortex-M3"出现一般有两种情况: 1.SWD模式下,Debug菜单中,Reset菜单选项(Autodetect/HW ...

随机推荐

  1. python爬虫学习(8) —— 关于4399的一个小Demo

    堂弟喜欢各种游戏,在没有网络的情况下,上4399显得很无力. 另外,4399广告好多,,而且加载慢.. 怎么办,,写个爬虫吧,,把4399上的"好玩"游戏爬下来. 1. 分析阶段 ...

  2. 使用 iscroll 实现焦点图无限循环

    现在大家应该都看到过焦点图轮播的效果,这个效果是什么样我就不截图了.昨天做练习,练习要求是使用iscroll实现焦点图的无限循环滚动,并且当手指触摸焦点图后,停止焦点图的循环滚动.第一次接触iscro ...

  3. [LeetCode] First Bad Version 第一个坏版本

    You are a product manager and currently leading a team to develop a new product. Unfortunately, the ...

  4. .NET跨平台之旅:corehost 是如何加载 coreclr 的

    在前一篇博文中,在好奇心的驱使下,探秘了 dotnet run ,发现了神秘的 corehost  —— 运行 .NET Core 应用程序的幕后英雄.有时神秘就是一种诱惑,神秘的 corehost ...

  5. web兼容学习分析笔记--块级、内联、内联块级元素

    一.块级.内联.内联块级元素 (1)块级元素:block **独占一行 **可设置width,height,margin,padding **内部可包含块级或内联元素 (3)内联(行内)元素:inli ...

  6. 关于SharpDevelop 4版本以上没有ILAsm模板项目问题

    学习CIL的时候遇到的问题,记录一下. 查了一下英文网站,SharpDevelop 3 版本有ILAsm模板,但是有人运行3版本的CIL项目有问题. 说明一下SharpDevelop 4版本添加ILA ...

  7. Jquery获取offsetHeight

    纯javascript: window.document.getElementById('MainColumn').offsetHeight jquery: $('#id').get(0).offse ...

  8. Beta版本冲刺总汇

    DAY ONE: http://www.cnblogs.com/aruba/p/6149032.html posted @ 2016-12-09 12:37 DAY TWO: http://www.c ...

  9. substr()函数

    substr 定义于头文件 <string> string substr (size_t pos = 0, size_t len = npos) const;复制子字符串,要求从指定位置开 ...

  10. iOS - 对UIColor颜色反差

    iOS中默认的很多方法可以获得不同种颜色的UIColor对象,但是White和Black等灰度值其实是用灰阶透明度调制 +colorWithWhite:alpha:,这些CGColorRef拥有2个组 ...