Backbone：绑定到视图的包装div

Question

我有一个主干IndexView，它为每个'任务'模型调用TaskView。我想将一个事件绑定到包装任务视图的li元素。例如，'className'属性是'task'，我想在'.task'上触发一个事件。

我可以从父（IndexView）视图绑定，但我想访问所点击视图中的信息，我猜这意味着事件应该绑定到子TaskView（？）

（另外，DOM类里面可以访问实际的任务模板......而不是包装.task li）

感谢任何想法 - 以下代码。

儿童观点

Backbonescaffolddemo.Views.Tasks || = {}

class Backbonescaffolddemo.Views.Tasks.TaskView extends Backbone.View
  template: JST["backbone/templates/tasks/task"]

  tagName: "li"
  className: "task"

  events:
    "click .task"    : "demoMethod"

  initialize: () ->
    _.bindAll(this, 'demoMethod', 'render')
    console.log @
    #@showTask()
    @el.id = 'sort_order_' + @model.get('id') if @model

  destroy: () ->
    @model.destroy()
    this.remove()
    return false

  demoMethod: () ->
    console.log 'Work dammit, work. Arghhh'

  render: ->
    $(@el).html(@template(@model.toJSON() ))    
    return this

父母视图

Backbonescaffolddemo.Views.Tasks ||= {}

class Backbonescaffolddemo.Views.Tasks.IndexView extends Backbone.View
  template: JST["backbone/templates/tasks/index"]
  id: "taskList"

  events: 
    "keyup #searchTasks" : "searchTasks"

  initialize: () ->
    _.bindAll(this, 'addOne', 'sortable', 'task_id_from_element', 'addAll', 'searchTasks', 'updateSort', 'sortable', 'render')
    @options.tasks.bind('reset', @addAll)
    @options.tasks.bind('reset', @sortable)
    @options.tasks.bind('add', @render)
    @updateSort()
    @sortable()

  #...

  addAll: () ->
    @options.tasks.each(@addOne)

  addOne: (task) ->
    view = new Backbonescaffolddemo.Views.Tasks.TaskView({model: task})
    $(@el).append(view.render().el)

  render: ->
    $(@el).html(@template(tasks: @options.tasks.toJSON() ))
    @addAll() 
    return this

Answer 1

啊，发现了。一个直接的“点击”：“demoMethod”（没有指定的DOM范围）完成这项工作。

Answer 2

我没有看到你在哪里添加包装TaskView的div。

默认情况下，Backbone视图包含在div中，但由于您将TaskView上的tagName设置为li，因此它将包含在li中不是div。