自定义数据属性选择器不起作用

Question

知道为什么会这样吗......

    var attr = $(this).data('link');
    console.log(attr); // profile_following
    console.log($("a[data-target='profile_following']")); // found the object
    console.log($("a[data-target='+attr+']")); // [] empty

在点击处理程序里面我有上面的行！ console.log(attr); 成功打印profile_following然而，如果我尝试选择一个带有属性选择器的链接，这个变量就像这个console.log($("a[data-target='+attr+']")); 它找不到元素！

而最奇怪的是，如果我像console.log($("a[data-target='profile_following']"));一样对该行进行硬编码console.log($("a[data-target='profile_following']")); 它成功找到了对象。

知道为什么同一行不适用于属性选择器内的+attr+ ？

Answer 1

您需要使用字符串连接来创建值为"a[data-target='profile_following']"的字符串。 你这样做：

$('a[data-target="'+attr+'"]');

在您的示例中， +attr+是字符串的一部分，因为您从未关闭并重新打开引号。