如何使用多个变量来创建多个jquery选择器？

Question

当我将多个变量转换为多个选择器时，下面的代码无法执行。

DEMO HERE

$('.Btn').on('click', function () {
  var outer = $(this).data('test');
  var inner = $(outer).children('.Inner');
  $(outer + ',' + inner).addClass('Success');
});

在上面的代码中：

这是成功的

$(outer).addClass('Success');

这是成功的

$(inner).addClass('Success');

这不是

$(outer + ',' + inner).addClass('Success');

问题

如何使用多个变量来创建多个jquery选择器？

Answer 1

只有两个变量都包含字符串时，后一种方法才有效。在您的情况下，您需要使用add()将变量中保存的对象连接在一起：

$(outer).add(inner).addClass('Success');

Updated fiddle

Answer 2

在你的脚本中，outer是一个字符串，但inner是一个jQuery对象。您无法将这些值相互连接。当然，您可以将内部类名称作为字符串，但它有点棘手，并不总是运行良好...

如果你必须有+'，'+语法，这就是解决方案，但正如我所提到的那样，这真的很糟糕：

$('.Btn').on('click', function () {
    var outer = $(this).data('test');
    var inner = '.'+$(outer).children('.Inner').attr('class').split(' ')[0];
    $(outer+', '+inner).addClass('Success');
});

如果使用add（）或find（）等方法处理内部div，则可以使用更好的解决方案。