使用模板文字的無法識別的表達式

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'嘗試了同樣let pathb = 'anything' ，它可以工作，但是我的變量是anima/01/inc

Answer 1

如jQuery的文檔顯示在這里 ，你需要使用周圍的屬性選擇值引號。 嘗試這個：

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

CSS屬性選擇器也是如此。

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>