如何使用 jQuery 验证插件检查特定字段是否有效？

Question

我正在尝试检查特定表单字段在按钮单击事件中是否有效，但无法正常工作。

我已经包含了这个 jQuery 库：

<script type='text/javascript' src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8/jquery.validate.min.js"></script>

和jQuery代码：

<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
    $(function () {
        //The client side validations
        var validator = $("#form").validate({
            rules: {
                brokercat: {
                    required: true
                }
            },
            messages: {
                brokercat: {
                    required: "required"
                }
            },
        });
    });

    $(".next").click(function () {
        alert($("#brokercat").valid());
    }); 
});
</script>

HTML代码：

<form name="form" id="form" action="#">
    <div class="radio">
        <input name="brokercat" id="radiobtn" type="radio" name="radio" value="cat05">
        <label for="radiobtn">
            <p>My business would benefit from having more cash available.</p>
        </label>
        <input name="brokercat" id="radiobtn1" type="radio" name="radio" value="cat04">
        <label for="radiobtn1">
            <p>My business needs to buy a new piece of equipment.</p>
        </label>
        <input name="brokercat" id="radiobtn2" type="radio" name="radio" value="cat02">
        <label for="radiobtn2">
            <p>My business wants to buy the property that it already
                <br/>occupies or is looking to move into. Or, I am looking to buy
                <br/>a business and that includes the premises it occupies.</p>
        </label>
        <input name="brokercat" id="radiobtn3" type="radio" name="radio" value="cat06">
        <label for="radiobtn3">
            <p>I need to acquire a new vehicle for my business.</p>
        </label>
        <input name="brokercat" id="radiobtn4" type="radio" name="radio" value="cat07">
        <label for="radiobtn4">
            <p>I am looking to develop residential or commercial premises.</p>
        </label>
        <input name="brokercat" id="radiobtn5" type="radio" name="radio" value="cat08">
        <label for="radiobtn5">
            <p>I need to borrow for less than 12 months for a property transaction.</p>
        </label>
        <input name="brokercat" id="radiobtn6" type="radio" name="radio" value="cat03">
        <label for="radiobtn6">
            <p>I have outstanding invoices that I would like to use to raise
                <br/>some extra funding.</p>
        </label>
        <input name="brokercat" id="radiobtn7" type="radio" name="radio" value="cat09">
        <label for="radiobtn7">
            <p>I/we have a pension fund that we would like to consider
                <br/>using to raise some capital.</p>
        </label>
        <input name="brokercat" id="radiobtn8" type="radio" name="radio" value="cat01">
        <label for="radiobtn8">
            <p>I am looking to buy a property as an investment and to rent
                <br/>it out.</p>
        </label>
        <input name="brokercat" id="radiobtn9" type="radio" name="radio" value="cat10">
        <label for="radiobtn9">
            <p>My business is looking to help with its overseas trading and
                <br/>exporting.</p>
        </label>
        <input type="button" class="next" value="Next" />
    </div>
</form>

我收到这个错误：

知道为什么它不起作用。

谢谢。

Answer 1

您在同一元素上使用了两次 name 属性。下面更改

<input name="brokercat" id="radiobtn" type="radio" name="radio" value="cat05">

到

<input name="brokercat" id="radiobtn" type="radio" value="cat05">

Answer 2

您的代码中没有 ID 为 brokercat 的元素，#brokercat 是一个基于 ID 的选择器。它是 name 属性。

使用

$("[name='brokercat']").valid()  //returns 0 or 1

$(".next").click(function () {
    alert($("[name='brokercat']").valid());
});

Demo

*注意：确保包含兼容的 jQuery 和 jQuery.validate.js 引用。

如何使用 jQuery 验证插件检查特定字段是否有效？

How to check specific field is valid or not using jQuery validation plugin?

javascript

jquery

jquery-validate