2011-05-06 42 views
1

不知道我在做什么错。我正在使用jQuery Validation插件。这是我的jQuery代码:jQuery验证插件无法识别有效输入

$('#form-login').validate({ 
    onsubmit: true, 
    onfocusout: false, 
    errorClass: 'invalid', 
    wrapper: 'li', 
    errorLabelContainer: '#login-error-list ul', 
    errorContainer: '#login-error-list', 
    highlight: function(element, errorClass) { 
     $(element).addClass(errorClass); 
     $(element.form).find('label[for=' + element.id + ']') 
      .addClass(errorClass); 
    }, 
    unhighlight: function(element, errorClass) { 
     $(element).removeClass(errorClass); 
     $(element.form).find('label[for=' + element.id + ']') 
      .removeClass(errorClass); 
    }, 
    rules: { 
     username: 'required', 
     password: 'required' 
    }, 
    messages: { 
     username: 'Please enter your username.', 
     password: 'Please enter your password.' 
    } 
}); 

我在编写本文时非常仔细地跟踪了API文档。但是,无论输入什么内容(无论是否有效),它仍然会抛出错误,就好像用户名和/或密码没有输入一样。您可以在this login page上看到自己。

任何人都知道问题可能是什么?

PS:我想补充一点生成表单和错误容器中的HTML代码:

<p>Already have an account with us? Then log in!</p> 
<form action="login.php" method="post" id="form-login"> 
<input type="hidden" name="success_page" value="" /> 
<div class="group"> 
    <label for="username">Username:</label> 
    <input type="text" name="username" id="username" title="Username" maxlength="20" min="6" max="20" /> 
</div> 
<div class="group"> 
    <label for="password">Password:</label> 
    <input type="password" name="password" id="password" title="Password" min="6" /> 
</div> 
<div id="login-error-list" class="group" style="display: none;"> 
    <p>Errors:</p> 
    <ul></ul> 
</div> 
+1

这是一个很长的镜头 - 但这可能是jQuery 1.6(本周早些时候发布)的一个问题。我知道他们改变了attr()的工作方式,并且它在Validation插件中使用得非常多。也许尝试链接到1.5.2。 – 2011-05-07 00:09:52

+0

我使用1.5.2而不是从jQ​​uery网站抓取最新版本,但问题仍然存在,因为您仍然可以在原始帖子中链接到的登录页面上看到问题。 (提高你的评论,因为它是有道理的,我只是有一天attr()有问题。) – TerranRich 2011-05-07 01:31:45

+0

我认为它的工作。我使用了以下插件 试试这个js文件 – 2011-05-07 04:58:48

回答

3

删除您的自定义消息,你会看到什么真正的问题是:

http://jsfiddle.net/DLcLJ/

将两个输入设置为只接受数字> 6。

我假设你想要的是最小长度。用minlength替换两个min属性,并删除最大用户名。

+1

糟糕!我认为这些是新的HTML5属性。我责备Dreamweaver CS5让他们在打字时弹出,我自己做出假设。它现在有效 - 谢谢! – TerranRich 2011-05-08 02:30:34

相关问题