Question

我的按钮是：

<button type="submit" name="submit" class="btn-primary btn-block"
          id="submit">Login</button>

我的表格是：

<form action="b.php" method="post" id="formID" onsubmit="return post();">

我的JS功能是：

function post()
{   
  var cvs = $('#client-nbr').val();
  var cs = $('#cs').val();
  $.post('a.php',{postcvs:cvs,postch1:cs});
  alert("Post Function work");  
}

我的问题是：当我从alert函数中移除post()时，它不会发布到a.php，而当我在{{1}内使用return false时1}}函数，该函数适用于post()，但页面冻结，我无法从a.php获取数据！

Answer 1

当您删除警报时，ajax将被异步触发，然后您的函数将立即返回onsubmit事件，这将导致表单提交和页面更改，甚至在ajax之前完成。

由于您将值返回到onsubmit事件，因此您只需向函数添加return false即可。这将阻止默认操作（提交）并停止传播。

function post() {
    ...
    ...
    return false
}

编辑：

如果您在允许表单提交之前需要完成ajax，那么您应该如上所述返回false，但是向ajax添加成功处理程序以手动提交表单。

function post()
{   
  var cvs = $('#client-nbr').val();
  var cs = $('#cs').val();
  $.post('a.php',{postcvs:cvs,postch1:cs}, function(){
      $('#formID')[0].submit();
  });
}

Answer 2

onsubmit是可取消的事件（http://www.w3schools.com/jsref/event_onsubmit.asp）如果你“发布”函数返回false，则提交进程取消。

Answer 3

鉴于您希望在提交表单之前完成异步$.post，您需要：

通过在post函数
在$.post来电中添加成功回调，您可以在其中手动提交表单。确保不通过jQuery触发提交（在jQuery对象上使用.trigger('submit')或.submit()）。这将导致无限循环，因为它将再次触发post函数。相反，使用get(0)获取原始DOM元素并使用它来提交表单，如下所示。

试试这个：

function post() {
    var cvs = $('#client-nbr').val();
    var cs = $('#cs').val();
    $.post('a.php',{postcvs:cvs,postch1:cs}, function() {
        //Manually submit form
        $('#formID').get(0).submit()
    });
    return false;
}

有关为$.post添加回调的详细信息，请参阅https://api.jquery.com/jQuery.post/

$ .post jQuery仅在post函数内的警报时工作

3 个答案: