骨幹事件被多次觸發

我有一個與一個Model關聯的EditorView子視圖，它呈現一系列表單元素（input checkbox，textarea）。骨幹事件被多次觸發

我的ListView創建一個也是唯一一個編輯器子視圖。 ListView通過點擊ListView中的項目來創建編輯器視圖，方法是new EditorView(model: this.model). render();。

這很好。

但是，當事件被連接到編輯子視圖

// Bind to all properties in the view 
    events: { 
    "click input.isactive": "editActive" 
    },

會觸發該事件多次......每一次以前加載EditorViews。就好像許多HTML仍然存在一樣。但是檢查DOM（在Firefox中）只顯示一個EditorView的html。

我在EditorView中使用.html（字符串），我認爲它會替換'el'元素中的前一個html。

 var compiledTemplate = _.template(Template, data); // Merge model with template 
    this.$el.html(compiledTemplate); // replace the previous html if any. ?? OR NOT!! SOAD

感謝

的EditorView

el: ".editor", 

    tagName: "ul", 

    className : "striped", 

    events: { 
    "click .isactive": "editActive" 
    }, 

    render : function() { 

    var data = { 
     item: this.model, 
     _: _ 
    }; 

    var compiledTemplate = _.template(Template, data); // Merge model with template 
    this.$el.empty().html(compiledTemplate); // replace the previous html 
    return this; 
    }, 


    editActive: function(e) { 
     e.preventDefault(); 
     var x = this.$('.isactive').prop('checked'); // property of input checkbox 
     alert('click'+x); 

     var y = this.model.set('Active', x); 
    }

來源

2013-09-29 Gabe Rainbow

jquery文檔「使用.empty（）。html（字符串）而不是.html（字符串），以便在將新字符串分配給元素之前從文檔中刪除元素。」實際上沒有預期的功能 –

骨幹重視處理程序視圖的根元素，所以當你創建具有相同根元素若干意見回調多次註冊。它使用event bubbling來檢測在子元素上觸發的事件。問題是這一行：

el: ".editor",

即使你刪除所有的.editor內容，爲元素處理器本身將保持。您需要將其刪除，或者如果要保留它，則可以在創建新視圖之前使用視圖的undelegateEvents方法：它將刪除先前附加的事件處理程序。

來源

2013-09-29 19:15:08 zaquest

哦。我懂了。這意味着雖然html元素消失了。事件可能仍然存在...... –

@GabeRainbow不，不完全是。這是因爲事件處理程序不會附加到'.isactive'，而是附加到'.editor'，即使您在編寫'click .isactive'時也是如此。你永遠不會刪除'.editor'。 – zaquest

好的。我懂了。所以你需要在初始化器或其他地方調用undelegateEvents。 –

骨幹事件被多次觸發

回答

相關問題