Question

我正在使用JSON和iScroll创建一个动态列表，它完美无缺。问题是我的列表每20秒更新一次，每次更新列表时它会跳转到列表的顶部。我如何通过这个？

这是我的剧本：

var myScroll;

hoverClassRegEx = new RegExp('(^|\\s)iScrollHover(\\s|$)'),
removeClass = function () {
    if (this.hoverTarget) {
        clearTimeout(this.hoverTimeout);
        this.hoverTarget.className = this.hoverTarget.className.replace(hoverClassRegEx, '');
        this.target = null;
    }
};  

$(document).on('pageshow', function (){
    var userid=1,

    dataUrl = 'http://mypage.com/playermenu.php?callback=?&userid=' + userid,
    dataCallback = function (data) {
        var content = [];
        //var profile = [];
        $.each(data, function (i, val) {
            content.push(val.list); // GETTING ALL THE GAMES //
            $('#userbar').html(val.profile); // FETCHING USERS DATA FOR PROFILEBAR //
        });
        $('#games').html(content.join('')).listview('refresh');
    },
    fetchData = function () {
        //myScroll = new iScroll('wrapper');
        //myScroll = new iScroll('wrapper', { checkDOMChanges: true, hScrollbar: false, vScrollbar: false });
        myScroll = new iScroll('wrapper', { checkDOMChanges: true, hScrollbar: false, vScrollbar: false, 
            onBeforeScrollStart: function (e) {
                var target = e.target;

                clearTimeout(this.hoverTimeout);

                while (target.nodeType != 1) target = target.parentNode;

                this.hoverTimeout = setTimeout(function () {
                    if (!hoverClassRegEx.test(target.className)) target.className = target.className ? target.className + ' iScrollHover' : 'iScrollHover';
                }, 80);

                this.hoverTarget = target;

                e.preventDefault();
            },
            onScrollMove: removeClass,
            onBeforeScrollEnd: removeClass
        });
        if (myScroll.isReady()){
            $.getJSON(dataUrl, dataCallback);
        }
    };
    fetchData();
    setInterval(fetchData, 20000);

    document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
    document.addEventListener('DOMContentLoaded', function () { setTimeout(loaded, 200);  }, false);

});

希望得到帮助并提前致谢:-)

Answer 1

这被称为'橡皮筋效应'，并通过使用myScroll.refresh（）来解决

查看更新的小提琴

http://jsfiddle.net/VmQeE/10/

myScroll = new iScroll（'wrapper'，{   myScroll.refresh（），checkDOMChanges：true，hScrollbar：false，   vScrollbar：false，onBeforeScrollStart：function（e）{                 var target = e.target;
          clearTimeout(this.hoverTimeout);

          while (target.nodeType != 1) target = target.parentNode;

          this.hoverTimeout = setTimeout(function () {
              if (!hoverClassRegEx.test(target.className)) target.className = target.className ? target.className + ' iScrollHover' :
'iScrollHover'; }，80）;

当列表更新时，iScroll跳转到列表顶部

1 个答案: