选择2，多个选择标签，更改模板而不修改核心

Question

我正在使用Select2作为标签。该插件将×添加为原始X以删除标记。我真的不喜欢这个，我想使用我的一个图标<i class="icon icon-remove"></i>代替这个。不幸的是，在文档中我找不到任何有关如何覆盖此行为的信息。

例如，您可以使用templateSelection来更改标记的显示方式，但插件仍然会添加时间图标（我想要的功能，只是使用不同的样式）。

有没有办法在不更改核心文件的情况下修改模板？如果是这样，有人可以给我一个简单的例子吗？

我在这里找到了：

  MultipleSelection.prototype.selectionContainer = function () {
    var $container = $(
      '<li class="select2-selection__choice">' +
        '<span class="select2-selection__choice__remove" role="presentation">' +
          '&times;' +
        '</span>' +
      '</li>'
    );

    return $container;
  };

BTW我正在使用Select2 4。

Answer 1

如果您无法更改模板。你可以使用CSS简单风格。

您可以提供.select2-selection__choice__remove {font-size: 0}并在.select2-selection__choice__remove:after选择器上添加自定义图标。