0

次の JS コードを検討してください。

<script type="text/javascript">

$(function() {
    // Check if landing on the page with a hash
    if (window.location.hash.length) {
        $('html,body').animate({scrollTop: 200}, 100);
        return false;
    }

    // Same-page anchors
    $('a[href*=#]').click(function() {
        // ... find the target based on the div and animate the scrollTop property again
       }
    });
}); 
</script>

これが行うことは、最初に #anchor のあるページにランディングするかどうか、またはユーザーが同じページの #anchor をクリックしているかどうかを確認し、対応する ID を持つターゲット div に単純にアニメーション化することです。

問題は、これら 2 つが交互に機能することです。ハッシュ記号を含むページに到達すると、ページは div ID にアニメーション化されますが、後続の同じページ リンクはバインドされた「クリック」イベント (I'また、live()でバインドしようとしましたが、違いはありません)

クリーンな URL のページにアクセスすると、リンクは再び機能します。私は何を間違っていますか?

4

1 に答える 1

1

なぜfalseを返すのですか?これは意味がありません。「準備完了」イベント ハンドラーでは、防止できるデフォルトの動作やバブルアップされる DOM ツリーがないためです。さらに、次のステートメントが実行されるのを防ぎます (具体的には、リンクへのイベント ハンドラーのバインド)。

if (window.location.hash.length) {
    $('html,body').animate({scrollTop: 200}, 100);
    return false;  // <-- remove this line!
}
于 2012-06-11T17:13:34.137 に答える