《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 ...
随机推荐
- 深度优先搜索(DFS)
[算法入门] 郭志伟@SYSU:raphealguo(at)qq.com 2012/05/12 1.前言 深度优先搜索(缩写DFS)有点类似广度优先搜索,也是对一个连通图进行遍历的算法.它的思想是从一 ...
- 第一个C语言的小项目
这里先写下主要的业务代码,一些库代码稍后补充上 /** * Feed新闻个性化推送 */ #include "push_service_news.h" /** * 保证单进程运行 ...
- Compiler Error Message: CS0016: Could not write to output file 回绝访问
Compiler Error Message: CS0016: Could not write to output file 'c:\Windows...dll' 拒绝访问 C:\Windows\Te ...
- linux内存管理
一.Linux 进程在内存中的数据结构 一个可执行程序在存储(没有调入内存)时分为代码段,数据段,未初始化数据段三部分: 1) 代码段:存放CPU执行的机器指令.通常代码区是共享的,即其它执行程 ...
- [LeetCode] Count The Repetitions 计数重复个数
Define S = [s,n] as the string S which consists of n connected strings s. For example, ["abc&qu ...
- C++:通过gethostbyname函数,根据服务器的域名,获取服务器IP
本代码的编译环境为MAC,系统版本为10.11.6: #include <string.h> #include <netdb.h> #include <stdio.h&g ...
- java中jqGrid时间戳格式转换
找到如下代码 if( !isNaN( date - 0 ) && String(format).toLowerCase() == "u") { //Unix tim ...
- 敏捷组织中PMO应遵循的准则
敏捷改变了人们的工作方式,不仅仅是开发部门,而且还包括其它的部门,例如HR.财务以及PMO等.在大多数组织中,PMO是一个控制体.它指导项目团队的规范.模板以及流程.目前,大多数的IT组织都敏捷化了. ...
- map
说明 map()是python的内置函数. 定义:接收2个参数,第一个参数一般为方法:第二个参数为可迭代对象,此方法会自动迭代第二个参数,然后将获取的数据传入第一个参数. 案例操作 需求:将下面的数据 ...
- 《黑客反汇编揭秘》(2e)推荐书单
Must-Read Books and Other References Books on C/C++: The C Programming Language by Brian W. Kernigha ...