主干添加更多的事件后渲染

Backbone adding more events after render?

本文关键字:事件 添加      更新时间:2023-09-26

如何在将集合呈现给视图后添加更多事件

我有一个需要事件绑定到它们的所有元素id的列表。

目前我正在尝试使用jQuery onclick触发回调到一个函数在我的视图

问题是,在我的视图中的函数调用是未定义的jQuery点击事件。

我看了主干文档,它说使用delegateEvents但是文档没有显示示例....

http://documentcloud.github.io/backbone/View-delegateEvents

//add more dynamic events for the rendered employee list 
    addMoreEvents: function ()
    {
        console.log("List View - Add More DOM Events");

        for (var i = 0; i < this.employees.models.length; i++)
        {
            var element = "#" + this.employees.models[i].attributes.id;
            //bind event that when user clicks on <li> on employeelist , it will go fetch all the tasks for that employee
            $(element).click(this.getEmployeeInfo()); //not working!
        }

    }

必须有一个简单的方法来为渲染后存在的元素添加事件。

谢谢

你做错了。而不是试图直接绑定到#some-id元素上的点击事件,你应该把一个类附加到你想要点击的东西上,然后使用视图的普通events对象将点击处理程序绑定到该类的元素。

例如,在视图的el内的HTML中有这样的内容:

<li class="item" id="6">Where</li>
<li class="item" id="11">is</li>
<li class="item" id="23">pancakes</li>
<li class="item" id="42">house?</li>

然后你会看到events像这样:

events: {
    'click .item': 'getEmployeeInfo'
}

然后您的点击处理程序getEmployeeInfo可以查看ev.currentTarget.id以获得被点击项目的id属性:

getEmployeeInfo: function(ev) {
    var id = ev.currentTarget.id; // this will be the model's `id`
    // do whatever needs to be done...
}