нераспознанное выражение с использованием литералов шаблона

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

Используйте кавычки "", включающие буквальный

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 2

Вы можете экранировать символы, имеющие специальное значение в селекторе 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>

Answer 3

Как показано в документации jQuery здесь , вам нужно использовать кавычки вокруг значения в селекторах атрибутов.Попробуйте это:

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

Это также верно для селекторов атрибутов CSS .