javascript - 在页面加载和单击时调用 ajax 来更新数据

Question

我试图让我的ajax在页面加载后加载数据，并能够在需要时单击按钮来更新数据。目前它仅适用于单击按钮。这是我所拥有的示例。

<a id="update" href="#" class="button">Update Data</a>
<div id="container">
  <div id="mydata"></div>
</div>

$(document).ready(function() {
  $("#update").click(function(e) {
    e.preventDefault();

    $.ajax({
      url: "mycode",
      dataType: "json",
      data: {
        //id: $(this).val(),
      },
      success: function(result) {
        alert(JSON.stringify(result));
      },
      error: function(result) {
        console.log(result);
      }
    });
  });
});

感谢您的浏览!

Answer 1

要实现此目的，您可以保留代码不变，只在加载时引发 click 事件:

$("#update").click(function(e) {
  e.preventDefault();
  // ajax logic here...
}).click(); // < raise event on load

或者，您可以将 AJAX 逻辑提取到在两个地方调用的函数中:

function makeAjaxCall() {
  // ajax logic here...
}

$('#update').click(function(e) {
  e.preventDefault();
  makeAjaxCall();
}); // on click

makeAjaxCall(); // on load