带Backbone.Marionette的Select2：未隐藏预选值

Question

我正在尝试在Marionette ItemView中集成Select2。

问题：我想用已经选择的值初始化Select2，但是选择的元素在下拉列表中仍然可用。 如果清除此框，然后从下拉列表中手动重新选择项目，则这些项目会从下拉列表中正确删除。

Javascript：

View.Profile = Marionette.ItemView.extend({
    template: profileTpl,
    onShow: function(){
      var $select = this.$("#categories"); // grabs the element for Select2
      $select.select2();                   // build the Select2 element
      $select.select2("val", ["american", "french", "italian"]); // select values
    }

HTML：

<select id="categories" data-placeholder="Add a category..." multiple class="form-control" tabindex="8">
  <option></option>
  <option value="american">American</option>
  <option value="french">French</option>
  <option value="italian">Italian</option>
  <option value="indian">Indian</option>
</select>

我可以在单个html示例页面上完成此操作，而不会遇到麻烦。

使用Marionette的onShow，“标记”元素会正确显示在Select2框中，但是当我单击该框以选择其他选项时，所有选项仍然可用。

我怀疑由于我在onShow事件中附加Select2元素的方式，某些事件未正确附加到Select2元素。

Answer 1

这是您的问题的有效示例。

仅一则注释与您的代码有关。 这是一个好习惯，当访问视图元素时，请使用this.$el.find('selector')引用，而不要通过jquery $('selector')进行查询。

您可以像this.$('selector')更短地完成它this.$('selector') 。