jquery获取单选框radio的值

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
    </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="确定1" id="btnclick1" />
        <input type="button" value="确定2" id="btnclick2" />
        <script src="../js/plugins/jquery-3.2.1.min.js"></script>
        <script type="text/javascript">
            $(function() {
                //没有默认选中的情况
                //先判断radio是否有选中项,再获取选中的值
                $("#btnclick1").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>
    </body>

</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值