JQuery Select2下拉onchange选项文本颜色没有改变

Posted 2023-05-07

【中文标题】JQuery Select2下拉onchange选项文本颜色没有改变

【英文标题】：JQuery Select2 drop down onchange option text color not changing

【发布时间】：2016-01-26 21:01:40

【问题描述】：

我有一个使用 Select2 的下拉菜单。我需要更改onchange 上的下拉选项文本颜色。我做了如下：

$("#e1").change(function()
   $(this).css('color', 'red');
);

但它没有按预期工作。

小提琴：FIDDLE

Select2 版本：4.0

【参考方案1】：

select2 更改了 html，您将不再拥有带有 id 的 e1 的 select。您将拥有的元素将是 div 和 id 的 s2id_e1。

看来：

id => "s2id_" + id

此外，您将不再有 change 事件，因为您的 div 将没有任何价值。您需要为s2id_e1 的select2-choice 元素使用click 处理程序：

$("#e1").select2();
$("#s2id_e1 .select2-choice").click(function()
   $(this).css('color', 'red');
);

【讨论】：

是否可以在 onchange() 上进行更改

不，当通过用户操作更改值时会触发更改。由于您最终会得到一个没有任何价值的 div，因此您需要忘记更改事件。

【参考方案2】：

您使用填充在元素上的.data('select2')，如下所示：

$("#e1").select2();
$("#e1").change(function() 
    $("#e1").data('select2').selection.css('color', 'red');
);

这是updated jsFiddle