使用模板文字的无法识别的表达式

Question

执行这段代码：

let pathb = $('.cslideract').attr('data-pathb');
console.log(pathb);

我得到以下结果：anima/01/inc。

现在我尝试在这个函数中使用它：

if($(`.partslider[data-pathb=${pathb}]`).length > 0){console.log('323');}

我收到此错误：

unrecognized expression: .partslider[data-pathb=anima/01/inc/]

我用 let pathb = 'anything' 尝试了同样的方法，它起作用了，但我的变量是 anima/01/inc

Answer 1

如 jQuery 文档 here 中所示，您需要在属性选择器中的值周围使用引号。试试这个：

if($(`.partslider[data-pathb="${pathb}"]`).length > 0){console.log('323');}

CSS attribute selectors也是如此。

Answer 2

使用引号 "" 括起文字

let pathb = $('.cslideract').attr('data-pathb');
console.log(pathb);


if($(`.partslider[data-pathb="${pathb}"]`).length > 0){console.log('323');}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="cslideract" data-pathb="anima/01/inc"></div>
<div class="partslider" data-pathb="anima/01/inc"></div>

Answer 3

您可以在 CSS 选择器 ($.escapeSelector()) 中转义具有特殊含义的字符：

let pathb = 'anima/01/inc';

console.log(`.partslider[data-pathb=${$.escapeSelector(pathb)}]`);

if($(`.partslider[data-pathb=${$.escapeSelector(pathb)}]`).length > 0){
    console.log('323');
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

使用模板文字的无法识别的表达式

unrecognized expression using template literals

html

javascript

jquery

webpage