javascript - 如何在主干中动态生成的按钮上绑定(bind)事件？

Question

如何在backbone.js中动态生成的按钮上绑定(bind)点击事件？

 window.PackageView = Backbone.View.extend({

    tagName: "div",

    className: "package-template",

    events:{
      'click #display-nodes'  :  'main', // This button is declared in my HTML code and calls main method successfully.
      'click .display'        :  'disp', // This is dynamic button generated with class as display
    },

    getAction: function(nodeId){ // Get Actions from NodeId and generate buttons
      $('.nodes').append("<button>" + action.Name + "</button>"); //Generate Buttons
      $(".nodes button").addClass("display");
    },

    disp: function(){
        alert("Inside Disp Function");
    },

单击#display-nodes 时，节点将按要求显示，但.display 不起作用。如何让这个按钮调用该函数？

Answer 1

Backbone View 可以通过 events 从动态生成的 DOM 元素接收事件。属性，只要动态生成的 DOM 元素是 View el 的后代。相关代码在 delegateEvents() 。它使用 jQuery 的 delegate()选择器方法。

它不适合您的最可能原因是新创建的 <button>不是 View el 的后代。我说得对吗？

如果是这种情况，并且您希望将该元素保留在 View 的 el 之外，您可以将其从 View 的 events 中删除。 View 中另一个元素的属性和委托(delegate) init方法。