Question

我在表单中使用它来检查单选按钮组是否具有特定值（是/否）。其中一个的HTML是：

<form id="registerHere">
<div class="control-group">
<label class="radio">
    <input type="radio" value="Yes" name="freemedia">
    Yes
    </label>
    <label class="radio">
    <input type="radio" value="No" name="freemedia" checked="checked">
    No
    </label>
</div></form>

我正在使用以下JS（包括jQuery.validate.js）：

<script type="text/javascript">
  $(document).ready(function(){});
$("#registerHere").validate({
            rules:{
                freemedia:{
                        required:true,
                        equalTo: "Yes"
                    },
                  },
            messages:{
                freemedia:{
                    required:"Please select",
                    equalTo:"Please apply to the 'freemedia' group first.</a>"
                },
                    },
        });
    });
  </script>

但是，它没有正确检查值，因为它始终显示消息，无论是否选中“是”或“否”。

我哪里错了？

Answer 1

我清理了你的一些jquery，你在那里遇到了一些错误。

另外，在插件中挖掘我注意到你可以使用'equalTo'参数来指定所需的控件。它只使用'equalTo'作为查询的选择器。因此，如果您将'equalTo'设置视为jquery选择器，它应该可以工作。它可能有点像黑客，但我有它的工作。

您需要做的就是为您的单选按钮分配一个ID，你应该好好去

<div class="control-group">
        <label class="radio">
            <input id="chkYes" type="radio" value="Yes" name="freemedia" />
            Yes
        </label>
        <label id="chkNo" class="radio">
            <input type="radio" value="No" name="freemedia" />
            No
        </label>
        <input type="submit" value="Submit" />
    </div>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#registerHere").validate({
                rules:
                {
                    freemedia:
                    {
                        required: true,
                        equalTo: "#chkYes"
                    }
                },
                messages:
                {
                    freemedia:
                    {
                        required: "Please select",
                        equalTo: "Please apply to the 'freemedia' group first."
                    }
                }
            });
        });
    </script>

Answer 2

在jquery验证插件中，“equalTo”用于比较字段之间的值，而不是在相同的字段上。（如果有人知道更多，我的研究。请告诉我。）
您可以添加自定义方法。

$.validator.addMethod("check_for_yes", function(value, element) {
  return $('.freemedia').val() != "Yes"
}, "* Please apply to the 'freemedia' group first.");

验证 -

rules : {
 freemedia : {
     check_for_yes: true
 }
}

或

您可以通过显示提醒来查看Jquery点击单选按钮事件。

Answer 3

你想检查你在表单提交时选择的值，这是一个很好的方法。给出一个预定义的选定单选按钮，然后在表单子任务时检查选中的单选，这里做了什么

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<input type="radio" name="sex" value="Male" checked>Male</input>
<input type="radio" name="sex" value="Female">Female</input>
<input type="radio" name="sex" value="Unknown" >Unknown</input>

<div onclick="CheckMe();"> check Selected Radio button</div>
</body>
<script>
function CheckMe()
{
alert("value selected "+$('input:radio[name=sex]:checked').val());
}
</script>
</html>

现在假设您没有默认选择任何单选按钮，那么您可以检查用户是否选择了任何无线电按钮，如果选择它是什么？以下代码可帮助您完成

<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<input type="radio" name="sex" value="Male">Male</input>
<input type="radio" name="sex" value="Female">Female</input>
<input type="radio" name="sex" value="Unknown">Unknown</input>

<div onclick="CheckMe();"> check Selected Radio button</div>
</body>
<script>
function CheckMe()
{
if ($('input:radio[name=sex]:checked').val())
alert("value selected "+ $('input:radio[name=sex]:checked').val());
else
alert("Please select Radio button");
}
</script>
</html>

享受..！

jQuery单选按钮值验证

3 个答案: