javascript - jQuery select2 为所选项目添加类

标签 javascript jquery jquery-select2

我希望能够向选定的标签添加一个类,以便我可以为它们设置不同的颜色。有没有办法做到这一点?作为示例,请参阅以下内容:

enter image description here

因此,如果我希望任何类别标签为绿色,任何位置标签为蓝色,任何关键字标签为红色,我该怎么做。我尝试过使用 templateSelection 选项,如下所示:

$('select').select2({
    templateSelection: function(item)
    {
        return '<span class="green">' + item.text + '</span>';
    }
});

但是 HTML 被转义,因此它显示了实际的字符。另外,无论如何,这都不会将该类添加到标签本身。

最佳答案

您可以使用该 templateSelection,然后搜索它是位置还是关键字,然后添加 escapeMarkup 属性:

function template(data, container) {
  if(/Location\:/.test(data.text)) {
     return '<span class="location">'+data.text+'</span>';
  } else {
     return data.text;
  }
}

$('select').select2({
  templateSelection: template,
  escapeMarkup: function(m) { return m; }
});

请看看它是否正常工作:

https://jsfiddle.net/cz4ofkvg/1/

关于javascript - jQuery select2 为所选项目添加类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36040971/

相关文章:

php - 当使用 while 循环选中复选框时,如何将文本框值复制到另一个文本框?

jQuery Select2 - 从原始选项的选择中获取样式属性

javascript - jQuery Select2 在表 TR 中追加后不出现

javascript - 动画中的不同步

javascript 未在我的 html 页面上执行 - 试图保持引导 Accordion 状态

javascript - Webpack:使用 Bundle.js, "React is not defined"

javascript - Select2 的最简单示例不起作用

javascript - Activiti错误:using JavaScript in . bpmn20.xml

javascript - SVG 的更改无法反射(reflect)到 PNG 上

c# - Selenium WebDriver MoveToElement - 隐藏元素、悬停和切换类