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,选中项
0
投稿
猜你喜欢
OpenCV半小时掌握基本操作之直方图
2022-01-30 10:19:28
36个折纸风格logo设计
2009-09-17 13:13:00
django manage.py扩展自定义命令方法
2023-11-03 20:55:42
10个超实用jQuery插件资源
2009-07-17 18:54:00
MYSQL子查询和嵌套查询优化实例解析
2024-01-23 13:24:34
使用Python 统计高频字数的方法
2023-07-19 09:20:18
Python常用模块logging——日志输出功能(示例代码)
2022-01-21 15:24:01
Django REST framework 限流功能的使用
2023-11-11 07:09:35
Hello! 404
2010-09-06 13:37:00
列出SQL Server中具有默认值的所有字段的语句
2024-01-16 20:17:27
表单name与id的区别和相似之处
2007-12-13 12:55:00
mysql varchar类型求和实例操作
2024-01-14 05:39:21
python 利用Pyinstaller打包Web项目
2021-11-25 12:22:36
简单了解python的内存管理机制
2021-10-03 18:13:11
python 常见的排序算法实现汇总
2023-09-17 13:47:24
php报错502badgateway解决方法
2023-11-22 13:12:06
python 特有语法推导式的基本使用
2023-06-25 01:39:58
python 获取毫秒数,计算调用时长的方法
2021-10-13 02:30:12
微信小程序实现上传视频功能
2023-08-24 16:18:42
DreamweaverMX制作导航下拉菜单
2010-07-02 16:29:00