是否有更短的方法来刷新 div答案

【问题标题】：Is there a shorter way to refresh div是否有更短的方法来刷新 div
【发布时间】：2015-05-12 15:41:52
【问题描述】：

我的页面中有一些元素，我需要每 5 秒刷新一次它们的内容。我将向您展示的代码运行良好，但它看起来很长并且不断重复。当我只使用 setInterval 函数时，页面不会在间隔到来之前定期加载。你能建议一个更好的方法来做到这一点吗？提前致谢。这是我的代码：

var $song=$(".song");
var $album=$(".album");
var $cover=$(".cover");
var $background=$(".overlay-bg");
$.ajax({
    url: "song.php",
    success: function (response) {
        var nowPlaying=$.parseJSON(response);
        $song.html(nowPlaying.song);
        $album.html(nowPlaying.album);
        $cover.css("background-image", "url("+nowPlaying.cover+")");
        $background.css("background-image", "url("+nowPlaying.cover+")");
    }
})
var refreshSongDetails=setInterval(function() {
    $.ajax({
        url: "song.php",
        success: function (response) {
            var nowPlaying=$.parseJSON(response);
            $song.html(nowPlaying.song);
            $album.html(nowPlaying.album);
            $cover.css("background-image", "url("+nowPlaying.cover+")");
            $background.css("background-image", "url("+nowPlaying.cover+")");
        }
    })
}, 5000);

【问题讨论】：

将您的 AJAX 调用放入一个函数中，这样您就不必重复两次了。
取决于 Song.php 的实际操作。它可以直接返回歌曲列表吗？您将它存储在 js 中，并且每 5 秒循环一次，因此不需要多个 ajax 调用。
我相信你应该考虑使用 websockets -> html5rocks.com/en/tutorials/websockets/basics/…

标签： javascript jquery ajax

【解决方案1】：

将您的 ajax 调用创建到一个函数中并调用它：

var $song=$(".song");
var $album=$(".album");
var $cover=$(".cover");
var $background=$(".overlay-bg");

function ajaxCall() {
  $.ajax({
      url: "song.php",
      success: function (response) {
          var nowPlaying=$.parseJSON(response);
          $song.html(nowPlaying.song);
          $album.html(nowPlaying.album);
          $cover.css("background-image", "url("+nowPlaying.cover+")");
          $background.css("background-image", "url("+nowPlaying.cover+")");
      }
  })
}

ajaxCall();

var refreshSongDetails = setInterval(ajaxCall, 5000);

【讨论】：

请注意，它可以缩短为 setInterval(ajaxCall, 5000);，但仍然可以 +1