Question

我能否对这里发生的事情有新的认识，好吗？

该功能应该是：检查新数据，如果新的＆gt;淡出＆gt;重新加载＆gt;淡入淡出，如果不是新数据没有动画。然而现在它逐渐消失，并且每次都会检查新数据，当我在dev中打开它时，它并没有这样做。

$(function() {
    function reload(elem, interval) {
        var $elem = $(elem);
        var $original = $elem.html();
        $.ajax({
            cache: false,
            url: 'track.php',
            type: 'get',
            success: function(data) {
                if ($original == data) {
                    setTimeout(function() {
                    $("#air_track").fadeOut();
                        reload(elem, interval)
                    $("#air_track").fadeIn("slow");
                    }, interval);
                    return
                }
                $elem.html(data);
                setTimeout(function() {
                    reload(elem, interval)
                }, interval)
            }
        })
    }
    reload('#air_track', 5000)
});

请记住，我已经睡了20多个小时而没有多少睡眠，所以它实际上可能非常明显。

Answer 1

尝试使用DRY原则 - 不要重复自己。

每次都设置超时而不管数据，并在if：

中执行动画

$(function() {
  var reload = function(elem, interval) {
    var $el = $(elem);

    $.ajax({
      cache: false,
      url: 'track.php',
      type: 'get',
      success: function(data) {
        var html = $.parseHTML(data);
        var newText = $(html).text().trim(); 
        var current =  $el.find('span').text().trim(); 
        if (current != newText) {
          $el.fadeOut(function() {
            $el.html(data).fadeIn('slow');
          });
        }
        setTimeout(function() {
          reload(elem, interval);
        }, interval)
      }
    });
  };

  reload('#air_track', 5000);
});

jQuery动画未正确操作

1 个答案: