6

Ember アプリケーションで、Handlebars テンプレート内の HTML アンカーにジャンプするにはどうすればよいですか? 私が達成したいことを示す jsFiddle を作成しました

背景
Ember のアプリケーションを介したナビゲーション モデルは、HTML アンカーを使用します。

次の要件があります。ユーザーがハンドルバーlinkToヘルパーをクリックして新しいルートの宛先に移動すると、ブラウザはその新しいルートの宛先に関連付けられたハンドルバー テンプレート内のアンカーに自動的にスクロールする必要があります。

4

1 に答える 1

-1

jquery特定のセクションにスクロールするために使用します。

$('html,body').animate({
    scrollTop: $("a[name='someAnchor']").offset().top
});

同じことについては、このSOの回答を参照してください。

didInsertElementビューがレンダリングされた後にアンカーまでスクロールするには、ルートのビューの定義でオーバーライドします。

同じことについては、このSOの回答を参照してください。

App.LonglistView = Ember.View.extend({
    didInsertElement: function() {
        // Place the scroll to anchor code here.
        $('html,body').animate({
            scrollTop: $("a[name='someAnchor']").offset().top
        });
     }
});

jsfiddleの実際の例を次に示します (わかりやすくするために、データ モデルは追加していません)。

編集: jquery 以外の方法を使用してスクロールを行うこともできます

document.getElementsByTagName('a')[name='someAnchor'].scrollIntoView()

同じのjsfiddleの例

于 2014-06-25T09:49:28.700 に答える