Question

我追加的数据不在div。但是当我追加数据时，我的焦点或滚动位置介于追加内容之间。实际上，当用户滚动到底部时，我会附加数据。但是当我保存谷歌图像时，它会加载一些图像，然后当用户转到最后一行时，它会加载更多图像，而不会更改滚动位置。

我们可以在我的例子中做 http://jsfiddle.net/cQ75J/10/

 var pages = [page_1, page_2, page_3, page_4, page_5];
    var backupPages=new Array();
    var totalPage = "page_" + pages.length;
    $("#current").html(pages.pop());


$("#fullContainer").scroll(function () {

     if ($(this).scrollTop() >= $(this)[0].scrollHeight - document.body.offsetHeight && pages.length) {
          // alert("--")
          $("#next").html('')
        $("#pre").html('')
        $("#pre").html($("#current").html());
        $("#current").html('');

        $(this).scrollTop(
           $("#current").html(pages.pop())
            .appendTo($("#fullContainer"))
            .height()
        );
        }

});

我有一个例子，在追加后我的需要是相同的滚动位置。但它会在当前div中创建新的div。我需要新数据来自当前（id）div，当前数据转到上一个（id）div http://jsfiddle.net/hBvrA/

Answer 1

检查更新的小提琴：http://jsfiddle.net/hBvrA/1/

我创建了更新html结构的函数

function updateContents() {
    $("#pre").html($("#pre").html() + $("#current").html());
    $("#current").html("<div>" + pages.pop() + "</div>"); 
    $("#fullContainer").scrollTop($("#pre").height());
}

并使用等待计时器机制调用滚动事件：

var timerWait = 1000;
var timerFlag = false;

$("#fullContainer").scroll(function () {
    if ($(this).scrollTop() >= $(this)[0].scrollHeight - document.body.offsetHeight && pages.length) {
        // Clear timer
        clearTimeout(timerFlag);
        timerFlag = setTimeout(function() {
            updateContents(); 
        }, timerWait);
    }
});

为什么在追加数据时滚动的位置会发生变化？

1 个答案: