Question

我试图在提交之前制作一份要求某些事情成真的表格。在这里遇到ajax的一些问题..

 $('form').submit(function(event){
     form = $(this); // I've tried just: this. Same result
     material = $('#material'). val();
     hours = $('#hours'). val();

     // - Material and Hours are numbers
     if(isNaN(material)) {
         event.preventDefault();
         alert('Please enter a number for Material');
     }
     if(isNaN(hours)) {
         event.preventDefault();
         alert('Please enter a number for Hours');
     }


     event.preventDefault();
     $.ajax({
         url : 'page.php',
         data : {
             'id' : {{ id }}
         },
         type : 'post',
         dataType: "json",
         success : function(data){
            console.log(data);
            if(data.job_num == {{ job_id }}) {
                form.submit();
            } else {
                alert('Please enter a valid number');
            }
        },
        error: function(){
            alert('Please enter a valid number');                    
        }
    });

});

正如您所看到的，hours可能是NaN而且表单不会提交..但是当它到达ajax并且如果成功，表单将提交即使{{1仍然是hours ..

我已尝试在NaN陈述之前放置ajax，结果相同..不确定这是否是我忽略的简单，或者它是否真的很复杂..

Answer 1

错误return;之后放置alert()，它将结束事件函数no metter what。

event.preventDefault()将阻止提交form，而不是要执行的其余函数，这就是你的ajax请求一直被执行的原因。

在AJAX之前的preventDefault，表单仍然成功提交

1 个答案: