iscroll.jsのドロップダウンを解決して指をリフレッシュして画面のページが弾けない問題を書き出します

ブログの移行先http://lwzhang.github.io.
iscroll.jsのプルダウン・リフレッシュ効果を使用したことがある人は、iOSのブラウザで、プルアップまたはドロップダウン・リフレッシュの場合、指が画面を描いた後、ページが戻ってこないという問題に遭遇したことがあるはずです.多くの人はこの問題を解決できないので、いっそそのまま解決しないで、また直接HTMLを使わないで、オリジナルのHTMLページの代わりに使用します.
多くの友达も自分の解決策があると信じていますが、書いていないので、ネット上では解決策が見つかりません.多くのQQグループの中にも多くの人がこの問題をどのように解決するかを聞いているので、私はこの文章を書いて私の解決策を記録して、いくつかの友达に役立つことを望んでいます.
ドロップダウン・リフレッシュの主なコード:

    myScroll = new iScroll('wrapper', {
        vScrollbar: false,
        useTransition: true,
        topOffset: pullDownOffset,
        onRefresh: function () {
            if (pullDownEl.className.match('loading')) {
                pullDownEl.className = '';
                pullDownEl.querySelector('.pullDownLabel').innerHTML = 'Pull down to refresh...';
            } else if (pullUpEl.className.match('loading')) {
                pullUpEl.className = '';
                pullUpEl.querySelector('.pullUpLabel').innerHTML = 'Pull up to load more...';
            }
        },
        onScrollMove: function () {
            if (this.y > 5 && !pullDownEl.className.match('flip')) {
                pullDownEl.className = 'flip';
                pullDownEl.querySelector('.pullDownLabel').innerHTML = 'Release to refresh...';
                this.minScrollY = 0;
            } else if (this.y < 5 && pullDownEl.className.match('flip')) {
                pullDownEl.className = '';
                pullDownEl.querySelector('.pullDownLabel').innerHTML = 'Pull down to refresh...';
                this.minScrollY = -pullDownOffset;
            } else if (this.y < (this.maxScrollY - 5) && !pullUpEl.className.match('flip')) {
                pullUpEl.className = 'flip';
                pullUpEl.querySelector('.pullUpLabel').innerHTML = 'Release to refresh...';
                this.maxScrollY = this.maxScrollY;
            } else if (this.y > (this.maxScrollY + 5) && pullUpEl.className.match('flip')) {
                pullUpEl.className = '';
                pullUpEl.querySelector('.pullUpLabel').innerHTML = 'Pull up to load more...';
                this.maxScrollY = pullUpOffset;
            }
        },
        onScrollEnd: function () {
            if (pullDownEl.className.match('flip')) {
                pullDownEl.className = 'loading';
                pullDownEl.querySelector('.pullDownLabel').innerHTML = 'Loading...';
                pullDownAction();
            } else if (pullUpEl.className.match('flip')) {
                pullUpEl.className = 'loading';
                pullUpEl.querySelector('.pullUpLabel').innerHTML = 'Loading...';
                pullUpAction();
            }
        }
    });

ページが弾けないのは、指で画面を描いた後のtouchendイベントがトリガーされず、動画が弾けないためです.解決策は、指が画面の縁に近づくと、手動でアニメーションをトリガーする方法です.onScrollMoveメソッドに判定コードを挿入します.

        onScrollMove: function () {
            if((this.y < this.maxScrollY) && (this.pointY < 1)){
                this.scrollTo(0, this.maxScrollY, 400);
                return;
            } else if (this.y > 0 && (this.pointY > window.innerHeight - 1)) {
                this.scrollTo(0, 0, 400);
                return;
            }

            ......
        }

このコードの意味を説明します.this.yはページがスクロールされた垂直距離、this.maxScrollYは最大垂直スクロール距離、this.pointYは現在の垂直座標を指します.this.y < this.maxScrollYが既にプルアップされているプロセスであり、(this.y < this.maxScrollY) && (this.pointY < 1)がプルアップされ、指がスクリーンの縁に触れたとき、this.scrollTo(0, this.maxScrollY, 400)が手動でトリガーされ、ページが反発し始める.
ドロップダウンプロセスも同様に分析できます.
あなたの解決策を残してください.