<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. Azure机器学习入门(二)创建Azure机器学习工作区

    我们将开始深入了解如何使用Azure机器学习的基本功能,帮助您开始迈向Azure机器学习的数据科学家之路. Azure ML Studio (Azure Machine Learning Studio ...

  2. Struts2 讲解笔记

    1.第一个Struts2入门案例 1.找jar包 Struts2-core xwork-core ognl javasist freemarker commons-lang commons-io co ...

  3. [LeetCode] Convert a Number to Hexadecimal 数字转为十六进制

    Given an integer, write an algorithm to convert it to hexadecimal. For negative integer, two’s compl ...

  4. ASP.NET - Web API,从简单类型到复杂类型的参数传递用例,以及传递简单string类型的解决办法

    一,简单类型的传值 比如 public Users Get(int id) ,它可以使用两种方式获取: api/default/ $.get("/api/default",{id: ...

  5. SQLite3源程序分析之查询处理及优化

    前言 查询处理及优化是关系数据库得以流行的根本原因,也是关系数据库系统最核心的技术之一.SQLite的查询处理模块很精致,而且很容易移植到不支持SQL的存储引擎(Berkeley DB最新的版本已经将 ...

  6. QinQ

    7.3.1 QinQ技术诞生的背景 --<华为交换机学习指南> QinQ最初主要是为扩展VLAN ID空间而产生的,但随着城域以太网的发展以及运营商精细化运作的要求,QinQ的双层标签又有 ...

  7. 浅谈javascript面向对象

    我们常用的两种编程模式 POP--面向过程编程(Process-oriented programming) 面向过程编程是以功能为中心来进行思考和组织的一种编程方法,它强调的是系统的数据被加工和处理的 ...

  8. Winscp开源的SSH|SFTP

    WinSCP 主要功能 图形用户界面 多语言与 Windows 完美集成(拖拽, URL, 快捷方式) 支持所有常用文件操作,支持基于 SSH-1.SSH-2 的 SFTP 和 SCP 协议 支持批处 ...

  9. python笔记

    # coding=utf-8 定义后可使用中文#var定义输出i=1print(i)#ifif i>0: print(i)else: print("x")#循环+字符串拼接f ...

  10. MSMQ学习

    一.理论准备 MSMQ(MicroSoft Message Queue,微软消息队列)官方的解释是:在多个不同的应用之间实现相互通信的一种异步传输模式,相互通信的应用可以分布于同一台机器上,也可以分布 ...