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

时间:2015-05-05 08:46:06

标签: javascript jquery jquery-validate

我正在尝试检查特定表单字段在按钮点击事件上是否有效但不起作用。

我已经包含了这个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>

我收到此错误:

enter image description here

知道为什么它不起作用。

感谢。

1 个答案:

答案 0 :(得分:0)

您在同一元素上使用name属性两次。 改为

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

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