jQuery验证:验证重复密码/两种形式

时间:2014-08-26 15:59:22

标签: jquery jquery-validate

我很抱歉不熟悉JavaScript,但这个让我头疼了两天:

我的网站上有两个表单,并且我使用了jQuery Validation Plugin,因此可以检查模糊input。该插件可以正确验证电子邮件输入,但它会不断地为不匹配的密码抛出success

HTML:

<fieldset>
     <form>
           <label for="loginEmail">Email</label>
           <input type="email" id="loginEmail" required />
           <label for="loginPassword">Password</label>
           <input type="text" id="loginPassword" required />
           <button>Login</button>
     </form>
</fieldset>
<fieldset>
     <form>
          <label for="registerEmail">Email</label>
          <input type="email" id="registerEmail" required />
          <label for="registerPassword">Password</label>
          <input type="text" id="registerPassword" required />
          <label for="registerRepeatPassword">Repeat password</label>
          <input type="text" id="registerRepeatPassword" required />
          <button>Register</button>
     </form>
</fieldset>

的jQuery / JavaScript的:

$("form").each(function() {
    $(this).validate({
        onfocusout: function(element){
            $(element).valid();
        },
        rules: {
            registerPassword: "required",
            registerRepeatPassword: {
                equalTo: "#registerPassword"
            }
        },
        success: function(label){
            label.addClass("valid").text("OK!")
        }
    });
});

我错过了什么?

1 个答案:

答案 0 :(得分:0)

您在所有经过验证的输入元素上缺少name属性。

用于name选项的rules属性,如下所述。无论如何分配规则,此插件都使用name属性来跟踪输入,如果没有它们将无法正常工作。

rules: {
    registerPassword: "required",  // <- assigned by NAME attribute
    registerRepeatPassword: {      // <- assigned by NAME attribute
        equalTo: "#registerPassword"
    }
},

只需根据此示例修改HTML标记。

<input type="email" name="registerEmail" id="registerEmail" />

使用HTML中的required属性是多余的,多余的 IF 您已经在required方法中声明了.validate()规则。 jQuery Validate插件可以接受任何一种情况下的规则。