Backbone.View事件只觸發一次

Question

jumpToWave事件只被觸發一次，我不明白為什么。

這是我的看法：

var WaveModalView = Backbone.View.extend({

template:_.template($('#tpl-wave-modal').html()),

events: {
    'hidden': 'remove',
    'click .jumpToWaveBtn':'jumpToWave'
},
    jumpToWave:function(e){
        e.preventDefault();
        console.log("JMP")
        var marker = this.model.collection.markers[this.model.id];
        map.panTo(marker.getPosition());
        bounceMarker(marker,1750);
    },
render:function () {
    var model = this.model;
    var that  = this;
    $(this.el).html(this.template(model.toJSON()));

    if(model.get('waveReviews').length > 0){
        var reviewList = new WaveReviewList({model: model});
        $('#waveReviews' + model.id).html(reviewList.render().el);
    }

    this.$("#waveSync" + model.id).click(function(e){
        e.preventDefault();
        if(window.me){
            requestSyncWave(model.id,function(data){
               window.me.fetch();
            });
        }
    });

    this.$("#waveEdit" + model.id).click(function(e){
        e.preventDefault();
        window.waveUnderEdit = model;
        $(that.el).children(":first").modal('hide');
        openWaveEditModal(model);

    });

    return this;
}

});

這是模板中的相關按鈕：

<button class="btn btn-info jumpToWaveBtn" data-dismiss="modal" aria-hidden="true">Auf Karte
            anzeigen</button>

我點擊按鈕時有多個模態。 在“JMP”不再被記錄之后，該事件僅針對每個模態觸發一次。

Answer 1

我沒有在WaveModalView上看到你的代碼調用render ，但我懷疑問題是你從其他地方調用render() ，而這反過來調用$(this.el).html(...) ，它取代了視圖元素的內容，新插入的內容沒有綁定到其元素的事件。

如果這確實是問題，你可以通過在render()函數的末尾添加this.delegateEvents()來解決它。

例如，檢查這個問題和答案： 為什么在Backbone.js中第二次渲染后事件沒有觸發？