将样式应用于 select2答案

【问题标题】：Apply style to select2将样式应用于 select2
【发布时间】：2018-06-12 13:36:07
【问题描述】：

我有一个普通的选择框，我将其更改为花哨的 select2。现在，我想对其应用某种样式属性。

$('#myID').select2();
$('#myID').css('background-color','red');

这种简单的方法行不通。解决办法是什么？

【问题讨论】：

试试下面的链接stackoverflow.com/questions/2655925/…
我不相信你写这篇文章的方式会起作用，因为你将 css 应用于原始控件（选择或输入标签）而不是添加用于呈现 select2 的 html 元素。原始控件是隐藏的，因此对其应用样式并不是很有用。
这当然行不通。这就是这个问题的意义所在。如何将样式应用于 select2 创建的跨度？

【解决方案1】：

我自己找到了解决方案：

$('#select2-'+myID+'-container').parent().css('background-color', 'red');

【讨论】：

【解决方案2】：

这是因为使用 select2(); 命令，您已将 #myID 转换为 select2 对象，它不再充当简单的 <select> id！

你的 jQuery 应该看起来像这样

$($('#myID').data('select2')).css('background-color', 'red');

（不幸的是，现在无法自己测试它，因为 jsfiddle 不支持 select2）

【讨论】：

【解决方案3】：

这个问题之前已经回答过并且不止一次让我感到困惑，您想要编辑 Select2 css 文件，因为选择元素的样式将被覆盖。或者为它创建一个新主题。

.select2-search { background-color: #00f; }

或用于特定 ID

#myID.select2-search { background-color: #00f; }

【讨论】：

我不想将此样式应用于每个 select2，而只想应用于我通过 Id 标识的特定样式
您可以使 css 选择器仅通过特定的 id 和类应用于正确的元素。 #myID.select2-search { 背景颜色：#00f; }
很遗憾，select2-search 元素没有原始选择的 id。如何获得正确的 ID？
你能发布选择元素HTML的代码和相关的javascript吗？在我看来，如果您尝试通过脚本获取 ID（而不是在 html 中设置它），那么您也可以使用对您创建的 select2 元素的引用并使用 jquery 来修改它。 var mySelect2 = $('#myID').select2();此时 mySelect2 只是另一个具有额外功能和行为的 Jquery 对象。所以你可以将引用传递给 .css $(mySelect2).css("background-color", "red");