Question

我正在尝试根据所选值更改选择框的文本颜色。

正在工作，有点。有没有办法不将CSS应用于整个元素，而仅应用于选择框本身？

https://imgur.com/JJ3jSso当我应用灰色时，所有元素都会变成灰色。选择框折叠时，是否只有“（keine）”是灰色的？

$('select').on('change load', function(){
// console.log($(this).children("option:selected").val());
  if($(this).children("option:selected").val() == "keine"){
    $(this).css('color', '#BFBFBD');
  } else {
    $(this).css('color', '#000');
  }
});

$('select').trigger('change');

HMTL代码：

<select>
  <option value="keine">( keine )</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
</select>

https://jsfiddle.net/1keyup/bfd74h5k/1/

Answer 1

您可以获得选定的值，并检查它是否等于“ keine”。然后应用灰色：

$('select').on('change', function(){
  const value = $(this).val();
  if(value === 'keine') {
    // apply glay color
  } else {
    // apply default color
  }
});

Demo（这只是一个快速示例，当然可以重构：））

jQuery根据所选值更改select的文本

1 个答案: