这篇文章给大家分享的是jquery实现radio选中事件的方法及代码是什么。小编觉得挺实用的，因此分享给大家做个参考，文中的介绍得很详细，而要易于理解和学习，有需要的朋友可以参考，接下来就跟随小编一起了解看看吧。

 jquery实现radio单选框选中事件很简单，当我们选中radio选项的时候会触发事件，并获取radio选中的值，先用html实现radio单选按钮。

html代码如下，checked属性表示默认选中第一个，3个name属性一样的话，radio就会自动变成只能选择一项的单选按钮。

<div>
 <input type="radio" name="statisOption" checked value="erro">错题分布
 <input type="radio" name="statisOption" value="hege">合格率
 <input type="radio" name="statisOption" value="youxiu">优秀率
</div>

效果如图所示。

方法一：下面我们使用jquery实现radio控件的选中事件，代码如下。

$("input[name='statisOption']").change(function (obj) {
    var str = $("input[name='statisOption']:checked").val();
    //获取value值
    console.log(str)

});

方法二：当然了，你也可以 $("input[type='radio']") 这样来实现radio的选中事件，但是不太推荐，如下。

$("input[type='radio']").change(function (obj) {
    var str = $("input[type='radio']:checked").val();
    console.log(str)

});

为什么我推荐使用第一种方法呢？这是因为如果一个界面中有多个radio选项组，那么你就会把其它的radio事件也绑定起来了，因为业务逻辑可能不一样，所以不太适合。

到此这篇关于“jquery实现radio选中事件的方法及代码是什么”的文章就介绍到这了,更多相关内容请搜索群英网络以前的文章或继续浏览下面的相关文章，希望大家以后多多支持群英网络！

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

猜你喜欢

• 怎样用js实现淘宝图片切换的效果？

  这篇文章给大家分享的是有关用js实现淘宝图片切换的效果的内容，这个效果我们常常能在商城网站上看到，小编觉得挺实用的，因此分享给大家做个参考，感兴趣的朋友就跟随小编一起来看看吧。

• JS箭头函数使用有哪些事项要注意，具体怎么应用

  这篇文章主要给大家介绍了关JS 箭头函数的this指向，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧

• JavaScript垃圾回收是什么，产生和策略是怎样的

  这篇文章主要为大家介绍了JavaScript的垃圾回收机制，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助

• clipboard.js的作用是啥，具体如何使用

  clipboard.js是一款轻量级的实现复制文本到剪贴板功能的JavaScript插件，本文就详细的介绍一下如何使用，感兴趣的可以了解一下

• 如何通过provide实现Vuex的功能

  Vue3中有一对新增的api，provide和inject,熟悉Vue2的朋友应该明,这篇文章主要给大家介绍了关于vue3如何使用provide实现状态管理的相关资料,需要的朋友可以参考下