jQuery.validator.addMethod 中的 .post 总是返回 false

.post inside jQuery.validator.addMethod always returns false(jQuery.validator.addMethod 中的 .post 总是返回 false)

问题描述

我对 jQuery 和 javascript 编程非常陌生.我下面有一个程序可以检查用户名是否被使用.目前，PHP 脚本总是返回

I am very new to jQuery and javascript programming. I have a program below that checks whether username is taken or not. For now, the PHP script always returns

  if(isset($_POST["username"]) )//&& isset($_POST["checking"]))
    {
        $xml="<register><message>Available</message></register>";
        echo $xml;
    }

登录功能有效，但用户名检查无效.有任何想法吗?这是我所有的代码:

Login function works, but username checking doesn't. Any ideas? Here is all of my code:

$(document).ready(function() {
jQuery.validator.addMethod("checkAvailability",function(value,element){
    $.post( "login.php" , {username:"test", checking:"yes"}, function(xml){
        if($("message", xml).text() == "Available") return true;
        else return false;
    });
},"Sorry, this user name is not available");
$("#loginForm").validate({
    rules:  {
        username: {
            required: true,
            minlength: 4,
            checkAvailability: true
        },
        password:{
            required: true,
            minlength: 5
        }
    },
    messages: {
        username:{
            required: "You need to enter a username." ,
            minlength: jQuery.format("Your username should be at least {0} characters long.")
        }
    },
    highlight: function(element, errorClass) {
                $(element).fadeOut("fast",function() {
                $(element).fadeIn("slow");
                })
    },
    success: function(x){
        x.text("OK!")
    },
    submitHandler: function(form){send()}
});
function send(){
    $("#message").hide("fast");
    $.post( "login.php" , {username:$("#username").val(), password:$("#password").val()}, function(xml){
        $("#message").html( $("message", xml).text() );
        if($("message", xml).text() == "You are successfully logged in.")
        {
            $("#message").css({ "color": "green" });
            $("#message").fadeIn("slow", function(){location.reload(true);});
        }
        else
        {
            $("#message").css({ "color": "red" });
            $("#message").fadeIn("slow");
        }
    });
}
$("#newUser").click(function(){

    return false;
});

});

推荐答案

需要使用$.post() 即 $.ajax() 这样您就可以将 async 选项设置为 false，如下所示:

You need to use the expanded form of $.post() which is $.ajax() so you can set the async option to false, like this:

jQuery.validator.addMethod("checkAvailability",function(value,element){
    $.ajax({
      url: "login.php",
      type: 'POST',
      async: false,
      data: {username:"test", checking:"yes"},
      success: function(xml) {
        return $("message", xml).text() == "Available";
      }
    });
},"Sorry, this user name is not available");

目前，您分析响应的 success 函数发生在验证完成后，因为它是异步操作.所以目前，在使用返回值时它没有返回任何内容，并且 undefined ~= false，这就是它总是显示为 false 的原因.通过将 async 设置为 false，您可以让代码在没有回调的情况下按顺序执行，因此实际上使用了上面示例中的 return.

Currently your success function that analyzes the response happens after the validation finishes, because it's an asynchronous operation. So currently, it's not returning anything at the time the return value is used, and undefined ~= false, which is why it always appears false. By setting async to false, you're letting the code execute in order without the callback, so the return in the example above is actually used.

如果您可以调整页面的返回结构，另一种选择是使用验证插件的内置 remote 选项，就是这样的:)

Another alternative, if you can adjust your page's return structure is to use the validation plugin's built-in remote option, which is for just this sort of thing :)

这篇关于jQuery.validator.addMethod 中的 .post 总是返回 false的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！