javascript - jQuery AJAX请求语法问题(混合普通JS函数)

对于一个非常了解JQuery的人（不是我），这可能是一个简单的解释，但是当我像这样运行我的代码时，它可以正常工作：

$('input#addStatButton').click( function() {
    $.ajax({
      type: 'POST',
      url: '{{action("StatController@store")}}',
      data: $('form#new_stat').serialize(),
    })
    .done(function(refresh) {
      clearStat();
      $.get('{{action("StatController@show", [$game->id])}}', function(data) {
        var newData = $("#statList" , data)
        $( "#statList" ).html( newData );
        //console.log(newData);
      });
    });
  });

注意“ clearStat（）”函数的位置。这只是清除了一个表单，以防止用户两次提交它。我希望它能尽早运行，以便确保提交按钮可以快速消失。

但是，当我像这样运行它时，正是出于这个确切原因，在“ clearStat（）”下面没有任何内容起作用...

$('input#addStatButton').click( function() {
    clearStat();
    $.ajax({
      type: 'POST',
      url: '{{action("StatController@store")}}',
      data: $('form#new_stat').serialize(),
    })
    .done(function(refresh) {
      $.get('{{action("StatController@show", [$game->id])}}', function(data) {
        var newData = $("#statList" , data)
        $( "#statList" ).html( newData );
        //console.log(newData);
      });
    });
  });

如果有所不同，这是clearStat（）函数本身：

function clearStat() {
  addPlayerToStat(null, null);
  addStatToStat(null);
  document.getElementById("addStatButton").style.display = 'none';
  document.getElementById("playerSelected").style.display = 'none';
  document.getElementById("statSelected").style.display = 'none';
}

这使我感到困惑，因为我不太了解JQuery，但是我确信这只是一个愚蠢的事情。但是，在回答时，您还可以提供一种在AJAX请求之前运行'clearStat（）'的方法吗？

最佳答案

假设clearStat对form#new_stat表单中的元素进行操作，则需要在清除表单之前调用serialize，例如（请参见***注释行）：

$('input#addStatButton').click( function() {
  var formdata = $('form#new_stat').serialize(); // ***
  clearStat();                                   // ***
  $.ajax({
    type: 'POST',
    url: '{{action("StatController@store")}}',
    data: formdata,                              // ***
  })
  .done(function(refresh) {
    $.get('{{action("StatController@show", [$game->id])}}', function(data) {
      var newData = $("#statList" , data)
      $( "#statList" ).html( newData );
      //console.log(newData);
    });
  });
});