Question

我无法获取jquery.validation.js来验证选择框。它正在处理文本输入，但它不会显示选择的错误消息。如果我对文本输入进行验证，则提交。有谁看到我在这里缺少的东西？

<form name="consumerRegistration" id="consumerRegistration" action="" method="post">
    <label for="name" class="baseline-10">Full Name</label>
    <input type="text" name="name" id="name" class="required" placeholder="John Doe" min-length="2"/>
    <label for="email" class="baseline-10">Email</label>
    <input type="text" name="email" id="email" class="required email" placeholder="jdoe@yahoo.com"/>
    <label for="company" class="baseline-10">Company</label>
    <input type="text" name="company" id="company" placeholder="ie. Yahoo"/>
    <select name="country" id="country" class="required" required="required">
        <option selected="" val="" disabled="disabled">Country</option>
        <option val="United States">United States</option>
        <option val="Canada">Canada</option>
    </select>
    <a href="javascript:document.void(1);" title="Register" class="cta"><span>Register</span></a>

(function($){
if($('form#consumerRegistration').length){
    $('input').placeholder();
    $('form#consumerRegistration').find('a').on('click', function(e){
        e.preventDefault();
        if($('form#consumerRegistration').valid()){
            $('form#consumerRegistration').submit();
        } else {
            return false;
        }
    });
}
})(jQuery);

如果我错过了网站其他地方的解决方案，我发誓我已经看得太过分了。：）

该插件来自http://bassistance.de/jquery-plugins/jquery-plugin-validation/。

Answer 1

好的，你的问题是你并没有真正正确地使用jquery验证。你需要做的更像是这样：

首先，在document.ready上设置验证，如果你不这样做，它不会以任何其他方式验证表单：

$('form#consumerRegistration').validate(...//options here

接下来，为刚才提交表单的a元素创建一个点击事件（验证然后就可以了）

$('form#consumerRegistration').find('a').on('click', function(e){
    $('form#consumerRegistration').submit();
});

最后，您的选择未正确处理的原因是您没有正确指定其属性。很简单，val不是您选项的正确属性，value是。所以只需在所有选项中进行更改：

    <option selected="" value="" disabled="disabled">Country</option>
    <option value="United States">United States</option>
    <option value="Canada">Canada</option>

这里有效：http://jsfiddle.net/ryleyb/TTpSB/

Answer 2

Jquery Validation Plugin要求select的第一个选项为空以验证它们。例如：您的选择框应如下所示：

<select name="country" id="country" class="required">
        <option></option>
        <option val="United States">United States</option>
        <option val="Canada">Canada</option>
</select>

jQuery验证插件未验证选择框

2 个答案: