javascript - jQuery、bug 还是什么？ selectmenu 小部件的 addClass 仅适用于第一个元素

Question

我试图弄清楚这是一个错误还是我做错了什么: 将新类添加到选择菜单小部件的选择器

$(".select-cls").selectmenu()
   .selectmenu( "widget" ).addClass("red-cls");

仅选择第一个。

还尝试了像这样的单独选择器:

$(".select-cls").selectmenu("widget").addClass("red-cls");

得到相同的结果

fiddle

也许还有另一种方法可以为每个小部件添加类？

Answer 1

下面的代码等待 DOM 准备好。那可能不需要。某些 jquery 方法仅适用于一个元素。此代码循环遍历所有组件并添加类。

var selects = $(".select-cls").selectmenu({
  width: 75
});

// ready
$(function() {
  $.each(selects, function(i, element) {
    $(element).selectmenu('widget').addClass('red-cls');
  });
});

http://jsfiddle.net/9qkvfm1n/10/

这不是一个错误。 API 表示它返回单个 jQuery 元素。

您也可以仅使用 CSS 来完成此操作:

.select-cls + .ui-selectmenu-button {
  color: red;
}

使用Adjacent sibling selectors