javascript - 无法在 Backbone 中绑定(bind)点击事件

我似乎无法将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");
  },
});

最佳答案

我认为问题是这条线

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);

Check Fiddle

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

Calling render from initialize