Question

I have a form that I'm submitting through ajax. I have to check the input field values before submitting it, but no matter what I do, the form keeps submitting even though it is not passing the test. Does anyone know why this is going on? If you see my code below, the form submission function checks the values and returns false if the criteria is not met. However, for some reason return false nor event.preventDefault() are working. I have no idea what's going on. Maybe I'm overlooking something?...

function checkPass(){

    var newPass = $("#newPass").val();
    var confirmPass = $("#confirmPass").val();

    if(newPass != confirmPass || confirmPass == '') { 
        $( "#confirmDiv" ).addClass( "has-warning" );
        $( "#confirmError" ).addClass( "animated fadeInDown" );
        $( "#confirmError" ).addClass( "text-warning" );
        document.getElementById("confirmError").style.fontSize = '14px';
        document.getElementById("confirmError").innerHTML = "The passwords don't match.<br>";
        event.preventDefault();
        return false; 
    } else {
        $( "#confirmDiv" ).removeClass( "has-warning" );
        document.getElementById("confirmError").innerHTML = "";
        $( "#confirmError" ).removeClass( "animated fadeInDown" );
        return true; 
    }

}

function updatePassword(){

  checkPass();

  event.preventDefault();

  var url = "updatePassword.php";
  var form = $("#updatePassword");

  $.ajax({
    url: url,
    type: "POST",
    data: form.serialize(),
    success: function(a) {
      if (a == "Success!") {

         alert(a);

         document.getElementById('updatePassword').reset();

      } else {

         alert(a);

      }

    }
  });

}

Answer 1

您需要传递事件参数以使用event.preventDefault（），顺便说一句，您正在使用return false，应该可以避免。但是仔细查看您的代码，我发现了一个问题。您正在updatePassword和其余代码中调用checkPass

function updatePassword(){

  checkPass();
  // rest of the code still runs if checkPass returns false

因此，您需要在此处使用条件：

function updatePassword(){

  if(checkPass()) {
   // rest of the code

现在，您正在正确地防止这种行为。另外，如果您要使用preventDefault（），则可以通过在updatePassword中提供事件参数来修复代码。

您要分析的测试用例：

function test() {
  return false
}
function test2(){
  if(test())
  console.log('test2')
}
function test3(){
  test()
  console.log('test3')
}
test2()
test3()

Answer 2

您好，我假设在onsubmit事件时您的表单中正在调用“ updatePassword（）”方法，我认为您应该像这样进行一些更改，并且它对我有用，我希望它将对您有用

function updatePassword() {
        event.preventDefault();
        if (checkPass()) {

            var url = "updatePassword.php";
            var form = $("#updatePassword");

            $.ajax({
                url: url,
                type: "POST",
                data: form.serialize(),
                success: function (a) {
                    if (a == "Success!") {

                        alert(a);

                        document.getElementById('updatePassword').reset();

                    } else {

                        alert(a);

                    }

                }
            });
        }

    }

Why does event.preventDefault() does not always work?

2 个答案: