javascript - 当特定表单的 Ajax 完成时执行函数

Question

如何对特定表单使用 .ajaxComplete() 或(类似函数)？我尝试了以下代码，但它会在任何 Ajax 调用完成时执行。我只希望它在 Ajax 调用 #FormId 完成时执行。似乎应该有一个简单的解决方案，但我没有找到它。

$('#FormId').ajaxComplete(function() {
    console.log("Ajax call for #FormId completed");
});

Answer 1

尝试在 # 的 submit 事件中将 $.ajax() 的 context 设置为 this FormId 元素，检查 .ajaxComplete() 处的 settings.context.id事件;其中 settings 是第三个参数或最初传递给 $.ajax()

的 ajaxOptions

$(document).ajaxComplete(function(event, jqxhr, settings) {
   // if `settings.context.id` is equal to `FormId`, do stuff
   if (settings.context.id === "FormId") {
     alert(settings.context.id)
   }
})

$("#FormId").on("submit", function(e) {
  e.preventDefault();
  $.ajax({
    context: this
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<form id="FormId">
  <input type="text" value="abc" readonly />
  <input type="submit" />
</form>

<form id="FormId1">
  <input type="text" value="123" readonly />
  <input type="submit" />
</form>