javascript - 如何在页面刷新时正确编写 jQuery overscroll 代码以保存 div？

Question

我正在使用 Azoff 的 Overscroll jQuery 插件:WATCH IT HERE

我写了这段代码，但它似乎不起作用:

var PlanetRefreshTimeSec = 1; // Planet refresh time in seconds..

    function loadData() {

        $.ajaxSetup({
            cache: false
        });

        var updateScrollPosition = function() {
            var div = $('#show_planet_realtime');
            div.scrollTop(div.height());
        };

        $("#show_planet_realtime").load("../in/GameEngine/RealTimeRender.php?p=<?php echo $player; ?>", updateScrollPosition, function () {
            setTimeout( function () {
                loadData();
            }, PlanetRefreshTimeSec * 1000);
        });
    }
    $( function () {
        loadData();
    });

我想保留 map 位置，而这张 map 使用 .load() 自动刷新内容。听说jQuery cookie插件可以做到，所以也试了一下:

$(function(o){
    o = $("#my_planet").overscroll({
        cancelOn: '.no-drag',
        scrollLeft: 200,
        scrollTop: 100,
        drag: function () {
            var cookie_value = JSON.stringify($(this).offset());
            $.cookie('newPosition', cookie_value, {
                expires: 7
            });
        }
    }).on('overscroll:dragstart overscroll:dragend overscroll:driftstart overscroll:driftend', function(event){
        console.log(event.type);
    });

    if ($.cookie('newPosition')) {
        //console.log($.cookie('newPosition'))
        $("#my_planet").offset({
            top: JSON.parse($.cookie('newPosition')).top,
            left: JSON.parse($.cookie('newPosition')).left
        })
    }
});

但是它不起作用...就像我之前说的，我有确切的 Azoff's Overscroll jQuery map ，我想保存它的位置，同时刷新整个页面或该 map 正在刷新其内容...

Answer 1

这可能是一个计时/竞赛问题 - 您正在尝试获取空的 div 的高度。考虑延迟 scrollTop 函数调用的开始。也许尝试用 setTimeout(function(){div.scrollTop(div.height())},200); 替换 div.scrollTop(div.height());; .