无法在骨干网中绑定点击事件

Question

我似乎无法将click事件绑定到以下代码段中的操作。 有任何想法吗？

var SelectView = Backbone.View.extend({
  template: "#select-template",
  initialize: function() {
    this.render();
  },
  events: {
    "click .placeholder": "optionsDropdown",
  },
  render: function() {
    context = {className: this.className, options: this.model.get("options"), placeholder: this.model.get("placeholder")};
    $(this.el).html(getHTML(this.template, context));
  },
  optionsDropdown: function() { 
    alert("Hello");
  },
});

Answer 1

我认为问题是这条线

className: this.className

我在视图定义的任何地方都看不到className变量

  var SelectView = Backbone.View.extend({
    initialize: function () {
        this.className = 'placeholder';
    },
    events: {
        "click .placeholder": "optionsDropdown",
    },
    render: function () {
        context = {
            className: this.className,
            options: this.model.get("options"),
            placeholder: this.model.get("placeholder")
        };
        var template = _.template( $("#select-template").html(), context );

        this.$el.html(template);
    },
    optionsDropdown: function () {
        alert("Hello");
    },
});

var Model = Backbone.Model.extend({});

var newModel = new Model({
    'options' : 'Hello',
    'placeholder' : 'Type your name'
});

var newView = new SelectView({model : newModel});
newView.render();
$('.container').append(newView.el);

检查小提琴

您正在绑定应该在模板中的class="placeholder"的click事件。 定义它应该工作后，前提是您的模板中包含具有该类的元素。

从初始化调用渲染

Answer 2

您可以将DOM元素绑定到处理程序，例如， "click li":"optionsDropDown"

编辑：您缺少目标元素..这是一个工作的小提琴http://jsfiddle.net/FGeJd/

Answer 3

您在事件定义中缺少选择器。 它应该是这样的（假设输入ID为optionsId）：

events : {
    "click #optionsId": "optionsDropDown"
}