0

かなりの量の Javascript を書き終えたところです (最も関連性の高い部分以外は省略します)。1 つだけ問題が残っています。

ある時点でlocation.href、記事ページに進むために を使用する必要があります。ユーザーが記事ページからブラウザの戻るボタンをクリックすると、ホームページに戻りますが (良い)、ページは最初に移動したときの状態のままです (悪い)。

Javascript は単にページが変更されたことを認識せず、おそらくもっと驚くべきことに、HTML も認識しません (私が Javascript を使用して既存の HTML を変更した場所がいくつかあります)。

少量の開示: これはモバイル サイトです。タッチイベントを使用して、要素の短いプレス (長いドラッグではなく) をリッスンしています。私が試したあらゆる種類の非 Javascript リンクは、ドラッグ ビットを台無しにしてしまいました。指がどれだけ長い間ダウンしているかをあまり気にせず、通常、ドラッグ中に指を動かそうとするとびっくりしてしまいます。

ここで恐ろしく役立つコードは他に思い浮かびませんが、喜んで掲載させていただきます。

ありがとう！

-S

リクエストに応じて、関連するコードを以下に示します。

function t_end(e)
{
    var touch = e.changedTouches[0]; // Get the information for finger #1

    // we only really care if we've been dragging already,
    // and the finger that's been lifted is the same (first)
    // finger from the initial touch.
    if(dragging && !change_ready && touch.identifier == touchID)

    {
        var spd = (100.0 * touch.pageX / $(document).width() - last_touch[0].x)/(new Date() - drag_time);

        // if the finger has been down for a very short time,
        // and is not moving quickly when removed, this will
        // count as a click, and not a drag.
        if(new Date() - start_time < 50 && spd < .2 && spd > -.2)
        {
            debugText("leaving for page @ " + roll_data[current_story].link);
            location.href = roll_data[current_story].link;
        }else{

            var dir, new_story;

            // at higher speeds we will swap stories.
            // at lower speeds will will just return.
            if(spd > .2 || spd < -.2)
            {
                if(spd < 0)
                {
                    new_story = (current_story > 0 ? current_story - 1 : story_count - 1);
                    dir = "r2l";
                }else{
                    new_story = (current_story < story_count - 1 ? current_story + 1 : 0);
                    dir = "l2r";
                }
            }else{
                new_story = current_story;

                // nx: new x.  The point to which the
                // finger has dragged the current story
                var nx = 100.0 * touch.pageX / $(document).width() - anchor_point.x;
                if(nx < 0)
                {
                    current_story = (current_story > 0 ? current_story - 1 : story_count - 1);
                    dir = "l2r";
                }else{
                    current_story = (current_story < story_count - 1 ? current_story + 1 : 0);
                    dir = "r2l";
                }
            }

            change_ready = true;
            dragging = false;

            toStory(new_story, dir, "no", 100);
        }
    }
}
  • このコードはストーリー ローラーから取得され、モバイル サイトで使用されます。ストーリーは、画面の横からスクロールして、もう一方からスクロールすることで、リストを介して変化します。
  • この関数は、タッチエンド リスナーが指すものです。画面から指 (任意の指) が離されるたびに、トリガーされます。タッチ イベントの簡単な内訳については、こちらを参照してください。
  • roll_data(url)を含むいくつかのプロパティを持つArrayオブジェクトの です。link
  • toStory()は、スライド先のストーリー、現在のストーリーの位置をリセットするかどうか (またはで指定)"l2r"と時間を指定された選択されたストーリーにスライドする関数です。変更をアニメートする対象。最初のパラメーターを除いて、すべてオプションです。"r2l""yes""no"
  • debugText()ブール値 ( ) が true の場合に (という.innerHTMLか.html()、jQuery 経由で)を設定する単純な関数です。debugging

ページが戻ったとき、問題の最も直接的な兆候は、デバッグ テキストがまだ存在することです (そして、最後に設定されたものに設定されます。この場合は「ページ @ [url] に移動します」)。Javascript も停止しました (いくつかの変数は、誰かがクリックしてページを閉じたからといって、ページの操作が完了していないことを伝える必要があります)。

4

2 に答える 2

2

ページが離れたことを検出し、必要な状態に設定することができます。

<!DOCTYPE html>
<html>
<head>
    <title>unload demo</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script type="text/javascript">
        function resetPage() {
            // alert("unload");
            // reset page here
        }
    </script>
</head>
<body onunload="resetPage();">
    hello world
</body>
</html>
于 2012-07-02T15:55:01.753 に答える
1

代わりに history.pushState メソッドを使用できます。最初にサポートされていることを確認する必要があります

if (history.pushState)
    history.pushState("", "", url);
else
    window.location = url;
于 2012-07-02T16:38:03.267 に答える