JQuery判断radio是否选中并获取选中值的示例代码


Posted in Javascript onOctober 17, 2014

其他对radio操作功能,以后在添加。直接上代码,别忘记引用JQuery包

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JQuery radio</title>
<script type="text/javascript" language="javascript" src="JavaScript/jquery-1.6.1.min.js" ></script>
<script type="text/javascript" language="javascript">
/*------判断radio是否有选中,获取选中的值--------*/
$(function(){
$("#btnSubmit").click(function(){
var val=$('input:radio[name="sex"]:checked').val();
if(val==null){
alert("什么也没选中!");
return false;
}
else{
alert(val);
}
var list= $('input:radio[name="list"]:checked').val();
if(list==null){
alert("请选中一个!");
return false;
}
else{
alert(list);
} 
});
});
</script>
</head>

<body>
<form id="form1" >
<input type="radio" name="sex" value="男" />男
<input type="radio" name="sex" value="女" />女
<br />
<input type="radio" name="list" value="十分满意" />十分满意
<input type="radio" name="list" value="满意" />满意
<input type="radio" name="list" value="不满意" />不满意
<input type="radio" name="list" value="非常差" />非常差
<br />
<input type="submit" value="submit" id="btnSubmit" />
</form>
</body>
</html>

网友评论:var boolCheck=$('input:radio[name="sex"]').is(":checked"); 比较好,这种方法较简洁

is() 根据选择器、元素或 jQuery 对象来检测匹配元素集合,如果这些元素中至少有一个元素匹配给定的参数,则返回 true。

如果您保存后乱码,这里推荐使用notepad++处理。

Javascript 相关文章推荐
javascript实现颜色渐变的方法
Oct 30 Javascript
jquery中each方法示例和常用选择器
Jul 08 Javascript
JS实现Select的option上下移动的方法
Mar 01 Javascript
Javascript 获取鼠标当前的位置实现方法
Oct 27 Javascript
js实现hashtable的赋值、取值、遍历操作实例详解
Dec 25 Javascript
Webpack 4.x搭建react开发环境的方法步骤
Aug 15 Javascript
探秘vue-rx 2.0(推荐)
Sep 21 Javascript
微信小程序:数据存储、传值、取值详解
May 07 Javascript
富文本编辑器vue2-editor实现全屏功能
May 26 Javascript
JS实现动态倒计时功能(天数、时、分、秒)
Dec 12 Javascript
vue-cli3 取消eslint校验代码的解决办法
Jan 16 Javascript
vue 使用rules对表单字段进行校验的步骤
Dec 25 Vue.js
JS判断浏览器是否支持某一个CSS3属性的方法
Oct 17 #Javascript
js onmousewheel事件多次触发问题解决方法
Oct 17 #Javascript
js实现飞入星星特效代码
Oct 17 #Javascript
JavaScript sub方法入门实例(把字符串显示为下标)
Oct 17 #Javascript
JavaScript strike方法入门实例(给字符串加上删除线)
Oct 17 #Javascript
JavaScript link方法入门实例(给字符串加上超链接)
Oct 17 #Javascript
JavaScript italics方法入门实例(把字符串显示为斜体)
Oct 17 #Javascript
You might like
2021年最新CPU天梯图
2021/03/04 数码科技
PHPMyadmin 配置文件详解(配置)
2009/12/03 PHP
js对数字的格式化使用说明
2011/01/12 Javascript
jquery 动态创建元素的方式介绍及应用
2013/04/21 Javascript
jQuery实现的原图对比窗帘效果
2014/06/15 Javascript
深入讲解AngularJS中的自定义指令的使用
2015/06/18 Javascript
Express实现前端后端通信上传图片之存储数据库(mysql)傻瓜式教程(一)
2015/12/10 Javascript
浏览器环境下JavaScript脚本加载与执行探析之defer与async特性
2016/01/14 Javascript
Javascript 调用 ActionScript 的简单方法
2016/09/22 Javascript
微信小程序 解决请求服务器手机预览请求不到数据的方法
2017/01/04 Javascript
微信小程序实现提交input信息到后台的方法示例
2019/01/19 Javascript
javascript数组去重方法总结(推荐)
2019/03/20 Javascript
VsCode与Node.js知识点详解
2019/09/05 Javascript
vue调用语音播放的方法
2019/09/27 Javascript
Vue 的双向绑定原理与用法揭秘
2020/05/06 Javascript
[46:47]2014 DOTA2国际邀请赛中国区预选赛5.21 LGD-CDEC VS NE
2014/05/22 DOTA
[01:06]DOTA2隆重推出2016冬季勇士令状 内含上海特级锦标赛互动指南
2016/02/17 DOTA
[06:15]2016国际邀请赛中国区预选赛单车采访:我顶WINGS
2016/06/27 DOTA
python使用内存zipfile对象在内存中打包文件示例
2014/04/30 Python
在Python中使用SQLite的简单教程
2015/04/29 Python
在java中如何定义一个抽象属性示例详解
2017/08/18 Python
django中的setting最佳配置小结
2017/11/21 Python
python实现多张图片拼接成大图
2019/01/15 Python
Python符号计算之实现函数极限的方法
2019/07/15 Python
python datetime中strptime用法详解
2019/08/29 Python
Python3.9.0 a1安装pygame出错解决全过程(小结)
2021/02/02 Python
open_basedir restriction in effect. 原因与解决方法
2021/03/14 PHP
HTML5制作表格样式
2016/11/15 HTML / CSS
中科前程Java笔试题
2016/11/20 面试题
小学运动会表扬稿
2014/01/19 职场文书
关工委先进个人事迹材料
2014/05/23 职场文书
学生保证书格式
2015/02/27 职场文书
山楂树之恋观后感
2015/06/11 职场文书
警示教育片观后感
2015/06/17 职场文书
《火纹风花雪月无双》预告“神秘雇佣兵” 紫发剑客
2022/04/13 其他游戏
TS 类型收窄教程示例详解
2022/09/23 Javascript