jQuery - 迭代同级并识别按钮

Question

我有多个<select>我需要处理它们的对象 change()事件。我无法完全控制 DOM，因为插件会在运行时执行一些操作以使其更加复杂。结果，我发现自己有一个 button我需要根据所选项目的值更改其背景颜色。

我可以从所选项目中获取颜色的十六进制值。 <button>和 <select>将是 sibling ，因此我正在使用这种关系进行迭代，目的是在找到此按钮时停止。

$('select').on('change', function() {
    var this_color = $(this).val();

    $(this).siblings().each(function(i, elem) {

        if (elem.is(":button")) {
            elem.css('background-color', this_color);
            return false;
        }
    });
});

但这会引发错误

Uncaught TypeError: elem.is is not a function

我做错了什么？谢谢!

Answer 1

在您的情况下，elem是一个普通的节点对象，您必须将其转换为jquery对象才能使用.is()

if($(elem).is(":button")) {
  $(elem).css('background-color', this_color);

由于您使用 .each() 来迭代 jquery 元素集合，因此您可以使用 $(this) 而不是接收 element > 明确作为参数，

 $(this).siblings().each(function() {
   var _this = $(this);
   if(_this.is(":button")){
    _this.css('background-color', this_color);
    return false;
   }
 });