如何使用 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

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

用

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

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

演示

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