Backbone events not fired by a jquery click event inside the view
I cant figure out why the jquery click event to an event inside the view will not trigger..
I have a backbone view like this:
class TreeList extends Backbone.View
el: "#tree-list"
events:
"click li span":"toggleTree"
"click li .select":"selectChannel"
template: _.template """
<ul id="tree"></ul>
"""
initialize: =>
$(@el).undelegate('li span', 'click');
$(@el).undelegate('li .select', 'click');
$("body").css "cursor", "progress"
@render()
render: =>
$(@el).html @template
_.each @collection.models, (model) =>
item = new TreeListItem model:model
$("#tree").append item.render()
if model.attributes.selected
console.log($("##{model.attributes.ChannelID} .select"))
$("##{model.attributes.ChannelID} .select")[0].click() # this event is never fired (selectChannel event)
return this
toggleTree: (e) =>
console.log "toggle tree"
selectChannel: (e) =>
console.log "selet channel"
As you can see Im calling a click event on the element witch fires a toggleTree event when I click on it, but not with the jquery click method.
The console.log of that element:
[i.icon-check-empty select, prevObject: x.fn.x.init[1], context: document, selector: "#d972c967-6b56-40b5-99c9-a25300c03341 .select", jquery: "1.10.2", constructor: function…]
setting the background of the element to black does work..
$("##{model.attributes.ChannelID} .select").css
background:"#000"
Can any one shed some light why this is happening?
I think the element was not added to the DOM tree. Your code is:
$("#tree").append item.render()
You should have done the following:
$("#tree").append item.render().el
And the reason why you get a false presence is that you check it using
model.attributes.selected
Your views of the model were rendered but never added to DOM Tree. I think the best to check if a component exist in your DOM tree is to right click on your "Tree" and use "Inspect Element" function in Firefox or Chrome.
链接地址: http://www.djcxy.com/p/63108.html上一篇: 为什么骨干视图触发两次更改事件？