2

backbone.js イベント関数で scrollTo メソッドを呼び出そうとしています。リストのアンカーをクリックしたときに、特定の div タグまでスクロールしたい。クリック イベントを関数にバインドし、その関数で scrollTo メソッドを呼び出しましたが、" Uncaught TypeError: Object function (a,b){return new e.fn.init(a,b,h)}というエラーが表示されます。メソッド 'scrollTo' がありません」アンカーをクリックしたとき。

助けてください！

ここにいくつかのサンプルコードがあります。

var MenuItemListView = Backbone.View.extend({
    el: $('#menuitem_list_container'),
    initialize: function() {
        _.bindAll(this, 'render');
    },
    render: function() {
        var template = _.template( $("#menuitem_list_template").html(), {selectedindex: menuItemList.get('selectedindex'), menuitemlist: menuItemList.get('menuitemlist')});
        this.el.html(template);
        return this;
    },
    events: {
        "click .nav a":"buttonClick"
    },
    buttonClick: function(e) {
        e.preventDefault();
        target = e.currentTarget.hash;
        alert(target);
        $.scrollTo(target, 100);
    }
});
4

1 に答える 1

2

あなたがここで何をしているのかを知る限り、scrollTo プラグインを間違って使用しています。e.currentTarget.hashscrollTo プラグインで使用できるパラメーターは次のとおりです。

  • 相対セレクター$(...).scrollTo( 'li:eq(14)', 800 );
  • jQuery オブジェクト$(...).scrollTo( $('div li:eq(14)'), 800 );
  • DOM 要素$(...).scrollTo( $('ul').get(2).childNodes[20], 800 );
  • 絶対数$(...).scrollTo( 150, 800 );
  • 絶対数(ハッシュ)$(...).scrollTo( { top:800, left:700}, 800 );
  • 絶対位置$(...).scrollTo( '520px', 800 );
  • 絶対位置(ハッシュ)$(...).scrollTo( {top:'110px', left:'290px'}, 800 );
  • 相対位置$(...).scrollTo( '+=100px', 800 );
  • 相対位置(ハッシュ)$(...).scrollTo( {top:'-=100px', left:'+=100'}, 800 );
  • パーセンテージ$(...).scrollTo( '50%', 800 );

代わりにやりたいことは、打とうとしているアンカーの位置を見つけることです

これらは、バックボーン ビューが最終的にイベントをバインドするアン​​カーです。

<div class="nav">
  <a href="#foo">Foo</a>
  <a href="#bar">Bar</a>
</div>

これらは、あなたが攻撃しようとしているターゲットです:

<a name="foo">Foo</a>
<a name="bar">Bar</a>

そのため、前述の名前付きアンカーの場所を見つけようとする必要があります。

var hash = e.currentTarget.hash.replace('#', '');
var $anchor = $('a[name=' + hash + ']');

次に、次のような jQuery オブジェクト パラメーターを使用できます。

$.scrollTo( $anchor, 800 );

そしてそれはあなたの問題を解決するはずです

于 2012-05-10T09:52:33.633 に答える