jQuery 操作input中radio的技巧
更新时间：2016年07月18日 13:46:31 作者：平淡才是正
这篇文章主要介绍了jQuery 操作input中radio的技巧的相关资料,非常不错，具有参考借鉴价值，感兴趣的朋友一起看下吧
通过jQuery获取页面中的所有radio对象，遍历页面中的radio，取消选中的标签，因为使用到jQuery时间，因此引用到了网上公共的js，这只是本人的一些总结，大神勿喷。
<html>
<head>
<title>取消</title>
<script language="javascript">
function _onclick() {
$("input[name='ra']:checked").val();
var radios = document.getElementsByName("ra");
for (i = 0; i < radios.length; i++) {
if (radios[i].checked) {
radios[i].checked=false;
break;
}
}
}
function _onclick1() {
var item = $("input:radio[name='ra'][checked]").val();
alert(item)
var radios = $("input[name='ra']");
for (i = 0; i < radios.length; i++) {
if (radios[i].checked) {
radios[i].checked=false;
break;
}
}
}
function _onclick2() {
var radios = $("input[type='radio']");
for (i = 0; i < radios.length; i++) {
if (radios[i].checked) {
radios[i].checked=false;
}
}
}
</script>
</head>
<body>
<div><ol>
<li><input type="radio" name="ra" value="1">1</li>
<li><input type="radio" name="ra" value="2">2</li>
<li><input type="radio" name="ra" value="3" checked>3</li>
<li><input type="radio" name="ra" value="4">4</li>
<li><input type="radio" name="ra" value="5">5</li>
<li><input type="radio" name="ra" value="6">6</li>
<li><input type="radio" name="ra" value="7">7</li>
<li><input type="radio" name="ra" value="8">8</li>
</ol></div>
<div><ol>
<li><input type="radio" name="ra1" value="1">1</li>
<li><input type="radio" name="ra1" value="2">2</li>
<li><input type="radio" name="ra1" value="3" checked>3</li>
<li><input type="radio" name="ra1" value="4">4</li>
<li><input type="radio" name="ra1" value="5">5</li>
<li><input type="radio" name="ra1" value="6">6</li>
<li><input type="radio" name="ra1" value="7">7</li>
<li><input type="radio" name="ra1" value="8">8</li>
</ol></div>
<input type="button" value="GetValue1" onclick="_onclick()" />
<input type="button" value="GetValue2" onclick="_onclick1()" />
<input type="button" value="GetValue3" onclick="_onclick2()" />
<script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.js" type="text/javascript"></script>
</body>
</html>
文中使用3中获取radio对象的方式，前两种使用的比较多，第三种直接通过type标签获取对象，有可能获取到页面中所有的radio对象，因此不推荐使用。
以上所述是小编给大家介绍的jQuery 操作input中radio的技巧，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
相关文章
这篇文章主要介绍了jQuery实现全选、反选和不选功能的方法,结合实例形式详细分析了jQuery全选、反选以及不选功能的相关原理、实现方法及操作注意事项,需要的朋友可以参考下2019-12-12
浅析JQuery中的html(),text(),val()区别
jQuery中.html()用为读取和修改元素的HTML标签，.text()用来读取或修改元素的纯文本内容，.val()用来读取或修改表单元素的value值。2014-09-09
jQuery UI是一套非常好用的jQuery Tools库，目前已经发布的最新版本是1.8.4。在我自己的使用过程中，总有一些不爽。因为我下载的那个包里默认的主题样式是下图这样的，使用起来很难和具体的网页风格去配合。2010-09-09
这篇文章主要介绍了jQuery中append()方法用法,实例分析了append()方法的功能、定义及在匹配元素的结尾插入指定内容的使用技巧,需要的朋友可以参考下2015-01-01
jQuery.Form实现Ajax上传文件同时设置headers的方法
这篇文章主要介绍了jQuery.Form实现Ajax上传文件同时设置headers的方法，非常不错，具有参考借鉴价值,需要的朋友可以参考下2017-06-06
jQuery源码分析之jQuery.fn.each与jQuery.each用法
这篇文章主要介绍了jQuery源码分析之jQuery.fn.each与jQuery.each用法,较为详细的分析了each的用法,非常具有实用价值,需要的朋友可以参考下2015-01-01
jQuery实现的仿商城图片变亮变暗效果，鼠标悬停图片之后该图片变亮，其他图片变暗。移开鼠标所有图片变亮，兼容主流浏览器，适用浏览器：IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗，有需要的小伙伴可以参考下。2015-05-05
这篇文章主要介绍了jQuery仿Flash上下翻动的中英文导航菜单,实例分析了jQuery实现Flash反动特效的技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-03-03
JQuery 中没有文本框高亮显示这个插件，自己今天写了一个Plugin，把代码贴出来分享一下2011-04-04
工作不忙，闲来无事写了一个弹出层插件，又需要的尽管拿去用啊有什么建议欢迎提出2009-10-10
最新评论