Question

我希望使用jQuery

更改选择选项的class="value"

实施例

<select name="color_scheme" id="color_scheme">
  <option selected="selected">Default</option>
  <option>Black</option>
  <option>Blue</option>
  <option>Brown</option>
  <option>Green</option>
  <option>Gray</option>
  <option>Lime</option>
  <option>Orange</option>
</select>

<span class="Default"></span>

如果我们选择Black span类将

<span class="Black"></span>

让我知道

Answer 1

我通过存储默认类来实现这一点，并在选择更改时删除该类。

var selectedScheme = 'Default';

$('#color_scheme').change(function(){
    $('span').removeClass(selectedScheme).addClass($(this).val());
    selectedScheme = $(this).val();
});

可在此处找到一个工作示例：http://jsfiddle.net/9PeAc/1/

Answer 2

使用change事件确定用户何时选择了其他选项。要删除所有当前类，请在不带参数的情况下调用removeClass()。最后添加新类，可以通过this.value访问。

$('#color_scheme').change(function(e) {
    $('span').removeClass().addClass(this.value);
});

演示：http://www.jsfiddle.net/4yUqL/100/

Answer 3

尝试：

$('p').removeClass('myClass noClass').addClass('yourClass');

如何使用jQuery更改select选项上的元素类

3 个答案: