即使验证返回false，表单仍然会提交

Question

当我使用通用警报框时，表单验证工作正常，但如果尝试使用JQuery脚本使警报框看起来不错，表单将验证并提交，尽管返回的值为假

标准的警告框从codecanyon

工作

function validate(){ 
    if(document.audit_form.audit_name.value == "") 
     { 
     alert("Please select a name for your audit"); 
     document.audit_form.audit_type.focus() ; 
     return false; 
    } 
return true; 
} 

尝试一个与jQuery MSGBOX

function validate(){ 
    if(document.audit_form.audit_name.value == "") 
     { 
     $.msgbox("Please select an audit type", 
        { 
         type:"alert", 
         buttons: [ 
          {type: "submit", value: "Ok"} 
         ] 
        }, 
        function(result){ 

        if (result && result=='Ok'){ 
         return false; 
        } 
      }); 
     } 
return true(); 
} 

尝试两次与爱普瑞斯

function validate(){ 
    if(document.audit_form.audit_name.value == "") 
     { 
     apprise('Please enter a name for your audit?', {'textOk' : 'Ok',}, function(r) { 

      if(r) { 
       return(true); 
      } else { 
       return (false); 
      } 
     }); 
     } 
} 

在所有这三个实例中，警报框都会显示它应该的时间，但表单仍然会提交JQuery版本。该功能使用

<form id="audit_form" name="audit_form" method="post" enctype="multipart/form-data" 
action="<?php echo $_SERVER['PHP_SELF']; ?>" onsubmit="return validate();"> 

Answer 1

两个$.msgbox和apprise不阻塞函数调用，结果之前的功能回调返回，你应该改变你的逻辑。基本上这就是你的表单如何提交should看起来像：

$('#audit_form').submit(function(event){ 
    event.preventDefault(); 
    yourUIAlertFunction(..., ..., function(isSuccess){ 
      if(isSuccess){ 
       submitFormLogic(); 
      } else { 
       hideAlertAndShowErrors(); 
      } 
    }); 
});