jQuery选择框验证

Question

我在jQuery中有以下代码.
当select元素的选项值为"0" 时,我需要显示验证消息"Year Required ".

<script type="text/javascript">
$(document).ready(function () {
   $("#register").validate({
       debug: true,
       rules: {
           year: {
               required: function () {
                   if ($("#year option[value='0']")) {
                       return true;
                   } else {
                       return false;
                   }
               }
           }
       },
       messages: {
           year: "Year Required",
       },
   });
})
</script>

选择框

<select name="year"  id="year">
    <option value="0">Year</option>
    <option value="1">1919</option>
    <option value="2">1920</option>
    <option value="3">1921</option>
    <option value="4">1922</option>
</select>

Answer 1

由于您无法value=""在第一个中进行设置option,因此您需要使用内置addMethod()方法创建自己的规则.

jQuery:

$(document).ready(function () {

    $('#myform').validate({ // initialize the plugin
        rules: {
            year: {
                selectcheck: true
            }
        }
    });

    jQuery.validator.addMethod('selectcheck', function (value) {
        return (value != '0');
    }, "year required");

});

HTML:

<select name="year">
    <option value="0">Year</option>
    <option value="1">1955</option>
    <option value="2">1956</option>
</select>

工作演示:http: //jsfiddle.net/tPRNd/

原答案:( 只有你可以value=""在第一个内设置option)

要使用selectjQuery Validate插件正确验证元素,只需要第一个option包含value="".所以删除0from value="0"并将其修复.

jQuery:

$(document).ready(function () {

    $('#myform').validate({ // initialize the plugin
        rules: {
            year: {
                required: true,
            }
        }
    });

});

HTML:

<select name="year">
    <option value="">Year</option>
    <option value="1">1955</option>
    <option value="2">1956</option>
</select>

演示:http: //jsfiddle.net/XGtEr/

Answer 2

要在选择列表上放置require规则,您只需要一个空值的选项

<option value="">Year</option>

然后只需要自己应用就足够了

<script>
    $(function () {
        $("form").validate();
    });
</script>

与形式

<form>
<select name="year" id="year" class="required">
    <option value="">Year</option>
    <option value="1">1919</option>
    <option value="2">1920</option>
    <option value="3">1921</option>
    <option value="4">1922</option>
</select>
<input type="submit" />
</form>

小提琴就在这里