1

Подскажите почему работает:

$(".ms-noWrap[title ='10.07.2000']").attr("style","display: none");

не работает:

var data1 ='10.07.2000';
$(".ms-noWrap[title = data1]").attr("style","display: none");
5

2 ответа 2

1

Для простых переменных, которые не содержат в своих значениях точки, запятые, слэши - достаточно вставить переменную в строку, сконкатинировав эту переменную с ней (потому что данные внутри кавычек'' интерпретируются как строка. поэтому и переменная является простым текстом), либо с помощью интерполяции строк, появившейся в ES6 вставить переменную во внутрь строки.

Примеры взяты из ответа @Darth

var data1 ='666';
var data2 ='777';

$(".ms-noWrap[title = " + data1 + "]").attr("style","background: red;");

// Интерполяция, работает с ES6
$(`.ms-noWrap[title = ${data2}]`).attr("style","background: green;");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="ms-noWrap" title="666">10.07.2000</div>
<div class="ms-noWrap" title="777">10.07.2001</div>

Однако в вашем случае это не сработает, т.к. вы используете в качестве значения переменной дату, т.е. строку, содержащую точки. Парсер jquery парсит селектор регулярными выражениями и, видимо, это ломает ему мозг. Он не может понять откуда внезапно у атрибута title взялись запрещенные символы.

Поэтому для явного обозначения того факта, что нужно найти элемент, где значение атрибута title является строка, не зависимо от содержащих знаков, надо дополнительно обернуть переменную в кавычки. В итоге должно быть так:

var data1 ='10.07.2000';
var data2 ='10.07.2001';

$(".ms-noWrap[title = '" + data1 + "']").attr("style","background: red;");
// Интерполяция, работает с ES6
$(`.ms-noWrap[title = '${data2}']`).attr("style","background: green;");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="ms-noWrap" title="10.07.2000">10.07.2000</div>
<div class="ms-noWrap" title="10.07.2001">10.07.2001</div>

Пример с фильтрами не вижу смысла приводить.

-1
//1. 
$(".ms-noWrap[title = "+data1+"]").attr("style","display: none");
// 2. 
$(`.ms-noWrap[title = ${data1}]`).attr("style","display: none");
//3. 
$('.ms-noWrap').filter(index => $(this).attr("title") === data1).attr("style","display: none");
5
  • спасибо за замечание. считаю ваш ответ полностью исчерпывающим, посему свой удаляю)
    – Cheg
    10 июл 2017 в 11:13
  • первый вариант вроде не сработает. нужны доп. кавычки.... третий тоже какой-то странный 10 июл 2017 в 11:14
  • в общем ни один твой пример не работает) jsfiddle.net/zc9hrj2o ..... третий вообще неясен 10 июл 2017 в 11:36
  • @АлексейШиманский, в третьем ошибочно используются стрелочные функции. С обычными функциями все ок будет jsfiddle.net/zc9hrj2o/1
    – Grundy
    10 июл 2017 в 11:47
  • Для стрелочной функции надо использовать второй параметр, а не this -> jsfiddle.net/zc9hrj2o/2
    – Grundy
    10 июл 2017 в 11:48

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.