Question

以下javascript应设置一个间隔，以便json对象列表中的新项目将缓慢添加到列表顶部，但是它们都会同时添加。

<script type="text/javascript">
    var json;
    var count = 0;
    $(document).ready(function() {
        $.ajax({
            type: "POST",
            url: "/Home/PublicTimeLine",
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) {
                json = eval(msg);
                createRow();
            }

        });
    });

    function createRow() {
        if (count < json.length) {
            var data = json[count];
            var row = document.createElement("div");
            $(row).hide();
            row.appendChild(document.createTextNode(data.text));
            $(document).find("#results").prepend(row);
            $(row).fadeIn("slow");
            count++;
            setTimeout(createRow(), 3000);
        }
    }
</script>

<div id="results">
</div>

Answer 1

如果我是你，我会以稍微不同的方式解决它。为什么不将所有数据添加到您的页面上，只是隐藏它，只显示您想要的时间。这样你就不必担心关闭等等。

var intervalId;
$.ajax({
    type: "POST",
    url: "/Home/PublicTimeLine",
    dataType : "json",
    success : function (msg) {
        var json = eval(msg); // is this even needed?
        $.each(json, function(ind, data) {
            $("<div></div>")        // use jQuery to create the div
                .hide()
                .text(data)        // you can use jQuery to add contents too. (use .html() if you need HTML)
                .prependTo('#results')
            ;
        });
        intervalId = setInterval(showRow, 3000);
    }
});
function showRow() {
    var $myDiv = $('#results div:hidden:last');
    if ($myDiv.length) {
        $myDiv.show('slow');
    } else {
        clearInterval(intervalId);    // none more to show, stop checking
    }
}

如何在javascript中设置定时间隔？

1 个答案: