1

私は多数のスクリーンキャストを追跡し、バックボーンドキュメントを広範囲にトロールしましたが、ビューイベントが発生しない理由がわかりません。テスト用の私の（短い）コードは次のとおりです。

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/underscore.min.js"></script>
<script type="text/javascript" src="js/backbone.min.js"></script>

<script type="text/javascript">
    
    var App = (function($){
        
        var NavigationItemView = Backbone.View.extend({
            el: '#navigation',
            initialize: function(params){
                this.label = params.label;
                this.appendTo = params.appendTo;
            },
            events: {
                "click #add" : "test"
            },
            test: function(){
                $(this.el).html("<li>Testing...</li>");
            },
            render: function(){
                $(this.el).html("<li><a href=\"#\">"+this.label+"</a></li>");
            }
        })
        
        var self = {};
        self.init = function(){
            new NavigationItemView({ label: 'Test Nav Label' });
        }
        
        return self;
    });
    
    $(document).ready(function(){
         App(jQuery).init();
    })
    
</script>

これからinitメソッドコードを変更した場合：

new NavigationItemView({ label: 'Test Nav Label' })

これに：

new NavigationItemView({ label: 'Test Nav Label' }).render()

renderメソッドは完全に呼び出され、ビューの設定に問題がないことを示します。私はと交換render()することができtest()、同様にそれは動作します。

ただし、ID #addのリンクをクリックした場合でも、テストは実行されません。確かにそうする必要がありますか？明確にするために、DOMにid'add'のリンクがあります。チェックして、もう一度チェックしました。

jQueryを使用してイベントフックを追加し、ビューの特定のメソッドを手動で起動すると、それは機能します。私にとっては機能していないのは、バックボーン独自のイベントフックです。

私は関連する投稿を見てきましたが、提案のほとんどは私が持っているelプロパティを使用することでした。私の場合#navigationは空です。<ul>私はそれをdivに変更しましたが、動作に変更はありません。

すべてが大いに感謝するのに役立ちます。

4

1 に答える 1

3

#add要素はview要素（#navigation）の子ですか？イベントは、「el」を表示する子要素でのみ発生します。たとえば、これは機能しません。

<div id="navigation">
    ...
</div>

<div id="add">
    ...
</div>

これは：

<div id="navigation">
    ...
    <div id="add">
        ...
    </div>
    ...
 </div>
于 2012-03-27T11:03:37.833 に答える