Question

我知道这可能是愚蠢的，但我已经坚持了几个小时。

我有一个简单的表单，使用ajax进行jquery验证，以确定电子邮件地址是否已存在于数据库中。效果很好。找到电子邮件地址后，它会报告重复项，如果没有，则表示它是静默的。

但是当我输入一封我知道是新的电子邮件，并填写表单的其余部分，然后按提交时，它会阻止表单提交并将重点放在电子邮件字段上。

这是jQuery：

$(document).ready(function(){
var email;
var name;
var passwd;
var passwd_repeat;

     //form validation rules
     $("#regForm1").validate({
         rules: {
            name: {
                required: true,
                minlength: 3,
            },
            passwd: {
                required: true,
                minlength: 8,
            },
            passwd_repeat: {
                required: true,
                equalTo: passwd,
                minlength: 8
            }
         },
         messages:
         {
             name: "Please enter your name.",
             passwd: "Please enter a password.",
             passwd_repeat: "Passwords must match."
         }
     });

    $.validator.addMethod("validateUserEmail", function(value, element) {
        var inputElem = $('#regForm1 :input[name="email"]'),
        data = { "email=" : inputElem.val() },
        eReport = ''; //error report*/
        var dataString = 'email='+ inputElem.val();
        $.ajax( {
            type: "POST",
            url: '/checkdups.php',
            data: dataString,
            success: function(html) {
                if (html !== 'true') {
                  $('#email').after('<label class="error" for="email">error - '+inputElem.val()+' already in use. Please <a href="http://tester4.com/staff/auth/login">Log in</a> with '+inputElem.val()+'.</label>');
                  return false;
                }
                else {
                    return true;
                }
            },
            error: function(xhr, textStatus, errorThrown)
            {
                alert('ajax loading error... ... '+url + query);
                return false;
            }
        });
    }, 
'');

$(':input[name="email"]').rules("add", { "validateUserEmail" : true} );

}）;

我正在使用addMethod而不是使用.remote添加规则，因为我无法让这个东西比第一次工作更多（意味着它不会拒绝一连串没有页面刷新的欺骗），这是建议作为一种解决方法。当我评论添加的方法时，它允许我提交表单，但当然不会检查欺骗。

无论如何，任何见解都会非常受欢迎。

约翰

Answer 1

你真的应该使用remote。我不确定为什么你没有像预期的那样让它工作 - 远程绝对会多次被调用。它默认工作的方式是在你点击提交之前不调用远程页面，然后如果你的远程调用说它很糟糕，那么每次按键都会产生一个新的远程调用。

以下是您可以构建的simple working example。我将其设置为始终返回false，直到您进行了3次更改。所以你应该能够遵循这些步骤：

输入john@rand.com并单击“提交”。请注意，它被标记为无效。
删除m（无效）
删除o（无效）
删除c（无效，但由于它现在不是有效的电子邮件地址）
键入com（已修复）
提交（工作）

来自该小提琴的关键代码位于rules对象中（响应是此示例的全局计数器）：

rules: {
    email: {
        email: true, 
        remote: {
            url: '/echo/json/',
            data: {
                json: function(){
                    response++;
                    return (response > 3)?'true':'false';
                }
            },
            complete: function(data){
                $('#log').append('remote triggered<br>');
            },
            type: 'post'
        },
        required: true
    }
}

Answer 2

@Ryley，谢谢你的回复。我重试远程，它工作正常。我认为我的Firefox缓存存在问题。

我看起来非常像你，谢谢！

不应该使用addMethod进行jquery验证失败

2 个答案: