Не работает селектор атрибутов данных Jquery

#javascript #jquery

Вопрос:

У меня есть этот элемент

 <div class="messages selected" data-conversationId=""></div>

Устанавливается data-attribute conversationId динамически следующим образом:

 $(".messages").data("conversationId", conversationId);

У меня возникают проблемы с использованием селектора для выбора этого элемента по атрибуту данных.

 $(".messages[data-conversationId=4]")

Возвращает пустой массив. Интересно:

 $(".messages").data("conversationId")

ВОЗВРАТ 4

Что не так с моим селектором?

1. Он получает последний… Значит, последний может иметь значение 4 ?

2. Значения атрибутов должны быть заключены в кавычки. $('.messages[data-conversationId="4"]') .

3. Вам не хватает кавычек: $('.messages[data-conversationId="4"]') должно работать?

4. Я думаю, что вы обновляете атрибут данных, используя data() метод, который просто обновляет его свойство, а не атрибут…. поэтому вам нужно использовать filter() или обновлять значение атрибута с помощью attr() метода

5. У @PranavCBalan был правильный ответ, вы хотите отправить «обновить значение атрибута с помощью метода attr ()» в качестве ответа?

Ответ №1:

Если вы установите свой динамический атрибут с помощью jquery .data(), у вас возникнет вышеуказанная проблема.

Однако, если вы установите динамический атрибут с помощью метода jquery .attr(), у вас не будет этой проблемы

Пример здесь: https://jsfiddle.net/6dn5wjL8/8 /

HTML

 <div id="test1" class="messages selected" data-conversationId="">testContent1</div>
<div id="test2" class="messages selected" data-conversationId="">testContent2</div>

JS:

 // Will work
$("#test1").attr("data-conversationId", 4)
// Will not work
$("#test2").data("conversationId", 3)


alert("With selector .messages[data-conversationId=4] I found a div with this content: " $(".messages[data-conversationId=4]").html())

alert("With selector .messages[data-conversationId=3] I found a div with this content: " $(".messages[data-conversationId=3]").html())

Ответ №2:

Я думаю, что с помощью этого оператора $(‘.message[data-conversationId=4]’) вы пытаетесь выбрать элемент, который имеет класс message и у которого data-conversationId равен 4.

и этот оператор $(«.message»).data(‘conversationId’) в этом вашем примере вернет undefined, потому что в разметке вы упомянули его как data-conversationid=»»

измените разметку на data-conversationid=»5″ и проверьте с помощью оператора $(«.message»).data(‘conversationId’), он вернет 5

Надеюсь, это поможет

1. Опять же, я настраиваю его динамически, поэтому я не могу сделать это в разметке

2. не могли бы вы включить код, в котором вы его динамически настраиваете

3. Это поможет нам понять, что происходит