从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(); 
    } 
}); 

我相信还有更多的方法，但这些只是少数。