更新页面上的数据而无需刷新

Question

我有一个网站需要更新状态。就像飞行一样，您要离开，巡航或着陆。我希望能够刷新状态而无需让观众拥有并重新加载整个页面。我知道有一种使用AJAX和jQuery的方法，但是我对它的工作原理没有任何了解。我也不希望他们单击​​按钮。如果有人知道该怎么做，我将不胜感激！

Answer 1

通常，如果您不知道某些事情是如何工作的，请寻找可以学习的示例。

对于此问题，请考虑 [**this DEMO**](http://jsfiddle.net/u5s6mhwa/)

您可以看到使用jQuery很容易完成AJAX的内容加载：

$(function(){
    // don't cache ajax or content won't be fresh
    $.ajaxSetup ({
        cache: false
    });
    var ajax_load = "<img src='http://automobiles.honda.com/images/current-offers/small-loading.gif' alt="loading..." />";

    // load() functions
    var loadUrl = "http://fiddle.jshell.net/deborah/pkmvD/show/";
    $("#loadbasic").click(function(){
        $("#result").html(ajax_load).load(loadUrl);
    });

// end  
});

尝试了解其工作原理，然后尝试复制它。祝好运。

您可以找到相应的教程 [**HERE**](https://www.edufukunari.com.br/article/5-ways-make- ajax-calls-jquery/)

更新资料

现在，以下事件启动了ajax load函数：

$("#loadbasic").click(function(){
        $("#result").html(ajax_load).load(loadUrl);
    });

您也可以定期执行此操作：如何定期触发AJAX请求？

(function worker() {
  $.ajax({
    url: 'ajax/test.html', 
    success: function(data) {
      $('.result').html(data);
    },
    complete: function() {
      // Schedule the next request when the current one's complete
      setTimeout(worker, 5000);
    }
  });
})();

我为您演示了此实现[ **HERE**](http://jsfiddle.net/Low9o0qk/)
。在此演示中，内容每2秒（setTimeout(worker, 2000);）更新一次。

您还可以立即加载数据：

$("#result").html(ajax_load).load(loadUrl);

里面有[ **THIS**](http://jsfiddle.net/f1amwnab/) 相应的演示。