jQuery获取radio选中项的值实例
作者:酷小孩 时间:2024-04-09 19:45:16
<title></title>
<script src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(function () {
//没有默认选中的情况
//先判断radio是否有选中项,再获取选中的值
$("#btnclick").click(function () {
//获取选中项的value属性
var chkRadio = $('input:radio[name="list"]:checked').val();
if (chkRadio == null) {
alert("没有选中项");
return false;
} else {
alert(chkRadio);
}
});
//有默认选中的情况
//获取选中项的值,一般采用遍历的方法,判断哪一项选中,获取其value属性的值
$("#btnclick2").click(function () {
var chk2 = getRadioValue("list2");
alert(chk2);
});
function getRadioValue(radioName) {
var chkRadio = document.getElementsByName(radioName);
for (var i = 0; i < chkRadio.length; i++) {
if (chkRadio[i].checked)
return chkRadio[i].value;
}
}
})
</script>
</head>
<body>
<div>
<input type="radio" name="list" value="十分满意" />十分满意
<input type="radio" name="list" value="满意" />满意
<input type="radio" name="list" value="不满意" />不满意
<input type="radio" name="list" value="非常差" />非常差
</div>
<br />
<div>
<input type="radio" name="list2" value="十分满意2" checked="checked" />十分满意2
<input type="radio" name="list2" value="满意2" />满意2
<input type="radio" name="list2" value="不满意2" />不满意2
<input type="radio" name="list2" value="非常差2" />非常差2
</div>
<input type="button" value="确定" id="btnclick" />
<input type="button" value="确定2" id="btnclick2" />
</body>
</html>
演示截图:
1.没有默认选中项的情况下,获取为null:
2.没有默认选中项的情况下,获取选中项的value值:
3.有选中项的情况下,获取选中项的值:
标签:jQuery,radio,选中项
![](/images/zang.png)
![](/images/jiucuo.png)
猜你喜欢
Mysql中一千万条数据怎么快速查询
2024-01-15 06:57:05
WEB2.0网页制作标准教程(1)选择什么样的DOCTYPE
2007-11-13 12:57:00
常用java正则表达式的工具类
2023-06-14 09:16:46
python读取csv和txt数据转换成向量的实例
2021-09-12 12:01:24
Pycharm配置anaconda环境图文教程
2023-11-10 02:18:20
![](https://img.aspxhome.com/file/2023/1/125141_0s.png)
SQL Server 2000中的触发器使用
2024-01-15 15:33:34
scala中停止循环的三种方式(推荐)
2023-03-20 07:03:34
![](https://img.aspxhome.com/file/2023/2/75522_0s.png)
Mootools常用方法扩展(四)
2009-02-21 11:12:00
通过python-turtle库实现绘制图画
2023-11-23 17:39:35
![](https://img.aspxhome.com/file/2023/5/107595_0s.png)
PHP保留两位小数的几种方法
2023-11-15 05:17:54
MYSQL 数据库同步
2008-11-24 12:39:00
使用Eclipse如何开发python脚本
2022-06-25 12:41:39
![](https://img.aspxhome.com/file/2023/8/68848_0s.jpg)
python 中的jieba分词库
2023-08-10 01:26:30
Swoole webSocket消息服务系统压力测试解析
2023-06-09 01:55:45
![](https://img.aspxhome.com/file/2023/6/55506_0s.png)
Python3.5内置模块之shelve模块、xml模块、configparser模块、hashlib、hmac模块用法分析
2022-04-16 17:07:04
![](https://img.aspxhome.com/file/2023/8/133768_0s.png)
Python 多线程共享变量的实现示例
2022-12-17 09:39:10
python自动化操作之动态验证码、滑动验证码的降噪和识别
2023-03-26 02:48:28
![](https://img.aspxhome.com/file/2023/2/84922_0s.png)
python备份文件的脚本
2023-12-14 10:52:02
浅谈PHP中常用的3种设计模式
2023-10-18 06:23:02
MySQL8.0无法远程连接访问的解决方法
2024-01-19 02:55:54
![](https://img.aspxhome.com/file/2023/4/97434_0s.png)