從Backbone.js查看

Question

使用jquery模式時發出多個HTTP請求我有簡單的Backbone.js應用程序。在View中點擊按鈕時，我想調用jQuery模態插件。 Modals結構（html）的定義超出了View的定義。什麼是與Backbone.js一起使用jQuery的正確方法？

App.Views.Objava = Backbone.View.extend({ 

     tagName :"div", 
     className: "objava-single", 


    initialize: function() { 
    this.model.on('change', this.render, this); 
     this.model.on('destroy', this.remove, this); 
    }, 


    events: 
    { 
     'click #delete-objava': 'izbrisiObjavu', 

    }, 

    remove: function() { 
     this.$el.remove(); 
    }, 

    izbrisiObjavu: function(event) 
     { 

     var model = this.model; 

     $(".modal-obrisi").modal(); 

     $(".dugme-obrisi").on("click", function(){ 

      model.destroy(); 

      $(".modal-obrisi").modal("hide"); 


     }); 

    } 
}); 

這種類型的代碼會導致問題，特別是這部分緩存視圖的模型。

var model = this.model; 

這部分是某種方式，在第二刪除，創建多個HTTP DELETE請求。

編輯

Answer 1

你看到兩個請求外出時你刪除你的第二個職位，因爲第一$(".modal-obrisi").on一直沒有取消綁定。因此，如果您嘗試刪除第三個模型，它將觸發3個請求，依此類推。

要解決這個問題，您應該通過調用.off解除綁定。

$(".dugme-obrisi").on("click", function(){ 
    model.destroy(); 
    $(".modal-obrisi").off().modal("hide"); 
}); 

調用.off()不帶任何參數將關閉所有事件偵聽該元素。如果你想更好的控制，傳遞更多的過濾器參數。

OLD ANSWER

骨幹，是本質上意味着要非指令性的，所以沒有特別的「正確的方式」做事。

但我可以推薦幾個選項，您可以從中選擇哪種最適合您的具體應用：

選項1：傳遞模式選擇作爲一個選項，以查看和使用選擇實例模態。

// Parent 
var view = new App.Views.Objava({ modalSelector: ".dugme-obrisi" }); 
... 

// View 
App.Views.Objava = Backbone.View.extend({ 
    ... 
    izbrisiObjavu: function(event) { 
     $(this.options.modalSelector).modal(); 
    } 
}); 

選項2：傳遞一個回調的觀點，並讓家長處理click事件。

// Parent 
var view = new App.Views.Objava({ 
    callback: function() { 
     $(".modal-obrisi").modal(); 
    } 
}); 
... 

// View 
App.Views.Objava = Backbone.View.extend({ 
    ... 
    izbrisiObjavu: function(event) { 
     if(this.options.callback) this.options.callback(); 
    } 
}); 

方案3：使模態它自己的骨幹視圖。

// View 
App.Views.Objava = Backbone.View.extend({ 
    ... 
    izbrisiObjavu: function(event) { 
     var modalView = new App.Views.ObjavaModal(); 
     this.$el.append(modalView.el); 
     modalView.render(); 
    } 
}); 

// Modal view 
App.Views.ObjavaModal = Backbone.View.extend({ 
    render: function() { 
     // Render the modal content here 
     ... 

     // Make this view a modal 
     this.$el.modal(); 
    } 
}); 

我相信還有更多的方法，但這些只是少數。