javascript - 如何中止多个ajax请求

Question

通过单击“显示数据”按钮，我的 AJAX 调用会一次又一次地触发，并且相同的数据会添加到表中。首先，我想停止这种情况，其次，如果数据库中添加了一些新数据，有没有办法只用新数据更新数据库？

var showdata = document.getElementById("showdata");
var btn = document.getElementById("getdata");
btn.addEventListener("click", function() {
  var xhttp = new XMLHttpRequest();
  xhttp.open("GET", "<?php echo base_url() ?>Appconfig/get_masteradmin_data", false);
  xhttp.onload = function() {
    var ourData = JSON.parse(xhttp.responseText);
    renderHTML(ourData);
  };
  xhttp.send();
});

function renderHTML(data) {
  var html = '';
  var i;
  for (i = 0; i < data.length; i++) {
    html += '<tr>' +
      '<td>' + data[i].full_name + '</td>' +
      '<td>' + data[i].username + '</td>' +
      '<td>' + data[i].designation + '</td>' +
      '<td>' + data[i].department + '</td>' +
      '<td>' + data[i].official_mobile_no + '</td>' +
      '<td>' + data[i].official_email_id + '</td>' +
      '<td>' + data[i].select_user_type + '</td>' +
      '<td>' + data[i].permission + '</td>' +
      '</tr>';
  }
  showdata.insertAdjacentHTML('beforeend', html);
}

Answer 1

使用jquery html()方法代替showdata.insertAdjacentHTML('beforeend', html);