jquery显示/隐藏不等待完成

Question

我试图定期：

1. 从ajax调用获取数据
2. 将数据与div的内容进行比较
3. 如果是数据！=div的内容：隐藏div、更改数据、显示div

这是我的密码：

...

<div id="myDiv">old data</div>   
</body>

<script type="text/javascript">

$(document).ready( function() {
    updates();
    done();
});

function done() {
      setTimeout( function() {
      updates(); 
      done();
      }, 5000);
}

function replace(div, content){
    $(div).html(content)
}

function updates() {
    $.ajaxSetup({ cache: false });
    $.getJSON("mywebsite/get_data", function(data) {
        if ( $("#myDiv").html() !== data ){
            $("#myDiv").hide(400, replace("#myDiv", data));
            $("#myDiv").show(400);
        }
    });
}

</script>

...

问题在于，在div被完全隐藏之前，div内容被新数据替换，即使回调函数replace（）被提供给hide（）函数。

如何让hid（）函数等待它的完成（在这个例子中是400毫秒），然后再调用替换（）函数？

我还尝试了delay（）和setTimeout（），但它也做了同样的事情。

谢谢

Answer 1

我认为您不需要那种replace功能。无论如何，这应该是可行的：

function updates() {
    $.ajaxSetup({ cache: false });
    $.getJSON("mywebsite/get_data", function(data) {
        if ( $("#myDiv").html() !== data ) {
            $("#myDiv").hide(400, function() {
                $("#myDiv").html(data);
                $("#myDiv").show(400);
            })
        }
    });
}

看到JSFIDDLE（没有ajax调用）