jquery验证和ajax调用同时触发

时间:2010-12-16 08:02:01

标签: jquery ajax validation

    $("#submit-button").click(function() {

        if($.trim($("#email").val()) === "" ) {
            $(".error-message-email").show();
        }
        if($.trim($("#password").val()) === ""){
            $(".error-message-password").show();
        }
        return false;
    });
    $("#submit-button").click(function() {

    $.ajax({
    type:'POST',
    url:" " ,
    data:{"email": email, "password": password},
    success:function(data) {

        if(data["success"] === "True") {
                   // do something.
                 } else {

            if(data["message"] === "Email already exists.") {
                $(".error-message-email-exist").show();
            }       

                 }
    },
    dataType:"json"
    });

    return false;
  });

});

我有问题。如果发生错误,那么如何停止ajax调用。因为这里仍然没有通过验证我的表单,ajax调用被触发。我想阻止它。

3 个答案:

答案 0 :(得分:1)

像这样:

 $("#submit-button").click(function() {
        var error = false;
        if($.trim($("#email").val()) === "" ) {
            $(".error-message-email").show();
            error = true;
        }
        if($.trim($("#password").val()) === ""){
            $(".error-message-password").show();
            error = true;
        }
        if (!error) {
            $.ajax({
                type:'POST',
                url:" " ,
                data:{"email": email, "password": password},
                success:function(data) {

                    if(data["success"] === "True") {
                   // do something.
                    } else {

                    if(data["message"] === "Email already exists.") {
                        $(".error-message-email-exist").show();
                    }       

                 }
            },
            dataType:"json"
            });
        }
        return false;
    });

答案 1 :(得分:1)

不要将您的点击事件分开。

$("#submit-button").click(function() {
    var error = false;
    if($.trim($("#email").val()) === "" ) {
        $(".error-message-email").show();
        error = true;
    }
    if($.trim($("#password").val()) === ""){
        $(".error-message-password").show();
        error = true;
    }

    if(!error) {

          $.ajax({
              type:'POST',
              url:" " ,
              data:{"email": email, "password": password},
              success:function(data) {

                  if(data["success"] === "True") {
                         // do something.
                  } else {

                  if(data["message"] === "Email already exists.") {
                      $(".error-message-email-exist").show();
                  }       

                  }
              },
              dataType:"json"
         });

    }
    return false;
});

答案 2 :(得分:0)

由于您已将click绑定两次并在第二个中写入ajax调用,因此无论第一个是什么,它都会触发。它是完全独立的。