Question

当我更改模型时，我正在尝试将一个类添加到itemView的封闭标记中

View.Option = Marionette.ItemView.extend({
  tagName: "li",
  className: "option-item clearfix",
  template: optionsItemTpl,
  modelEvents: {
    "change": "modelChanged"
  },
  modelChanged: function() {
    console.log(this.$el);
    this.$el.addClass('success');
  }
});

以下输出我正在尝试将类添加到

的元素

console.log(this.$el);

但是没有添加课程，我只是不明白为什么会这样。

Answer 1

我将你的代码复制到了jsfiddle。好像它按预期工作。 console.log（这个。$ el）实际上并不会告诉你最初该值已经改变，因为它输出[li.option-item]但是你可以看到它没有显示它的clearfix。如果你深入挖掘$ el对象，你会看到成功类实际上是附加的。您也可以通过回显this.el来验证这一点，这是没有jQUery包装器的纯DOM元素。

Check out slightly modified code on jsfiddle

编码自己：

html：

<div id="conatainer"> </div>

javascript：

var View = {};
View.Option = Marionette.ItemView.extend({
  tagName: "li",
  className: "option-item clearfix",
  modelEvents: {
    "change": "modelChanged"
  },
  modelChanged: function() {
    console.log("Model Changed..");
    this.$el.addClass('success');
    $("#conatainer").append(this.$el);
    console.log("Updated Views $el:")
    console.log(this.$el);
      console.log("Updated Views el:")
      console.log(this.el);

  }
});

var model = Backbone.Model.extend();
var model_instance = new model({test: 1});
console.log("Model Instance:");
console.log(model_instance)
var view = new View.Option({model: model_instance});
console.log("View: ")
console.log(view);
model_instance.set({test: 2});

输出：

Model Instance:
Object {cid="c1", attributes=Object, _changing=false, ...}
View: 
Object {options=Object, cid="view2", model=Object, ...}
Model Changed..
Updated Views $el:
[li.option-item]
Updated Views el:
<li class="option-item clearfix success">

在Marionette itemView上使用jquery将addClass用于此。$ el

1 个答案: