У меня есть следующий сценарий:
var el = 'li';
и <li>
на странице 5 с data-slide=number
атрибутом (число 1,2,3,4,5 соответственно) .
Теперь мне нужно найти номер текущего активного слайда, который отображается var current = $('ul').data(current);
и обновляется при каждой смене слайдов.
До сих пор мои попытки не увенчались успехом, пытаясь создать селектор, который бы соответствовал текущему слайду:
$('ul').find(el+[data-slide=+current+]);
не соответствует / не возвращает ничего ...
Поэтому я не могу жестко кодировать li
часть в том , что это доступный пользователе переменный , которая может быть изменена на другой элемент , если требуется, поэтому он не может быть всегда li
.
Есть идеи о том, что мне не хватает?
.find(el+[data-slide=+current+]);
коде вы пишете? кажется, вы пропустили некоторые цитаты"[data-slide]"
$('*[data-slide]')
Вы можете использовать его, например, с$('*[data-slide]').each( function() { ... });
Ответы:
Вы должны ввести значение
current
в селектор Attribute Equals :Для более старых сред JavaScript ( ES5 и более ранних):
источник
$("ul").find(el + "[data-slide='" + current +"']");
.в случае, если вы не хотите вводить все это, вот более короткий способ запроса по атрибуту данных:
К вашему сведению: http://james.padolsey.com/javascript/a-better-data-selector-for-jquery/
источник
<ul><li data-slide="item"></li></ul>
этот селектор ответа вернет неопределенное значение, поэтому он не работает с учетом сценария пользователя. Этот ответ будет работать для структуры.<ul data-slide="item"><li></li></ul>
Хотя я понимаю, почему его популярность объясняется краткостью, технически это неправильный ответ. jsfiddle.net/py5p2abL/1[0]
для доступа к первому найденному элементу..find("[data-attrib='value']")
не работал. Я не знаю, были ли значения атрибутами данных добавлены jQuery или нет ...$.find
в частности, находит потомков этого элемента, но использование синтаксиса фильтра в строке селектора просто отфильтрует результаты.При поиске с помощью [data-x = ...] обратите внимание: он не работает с установщиком jQuery.data (..) :
Вы можете использовать это вместо:
источник
$.fn.filterByData
является блестящим; однако, это предупреждение для тех, кто копирует там ... вам нужно только$('<b>').filterByData('x', 1)
найти<b>
теги сdata-x="1"
. если вы скопируете и вставите.data(x, 1)
часть ... вы будете устанавливатьdata-x
«1» перед фильтрацией.Я улучшил расширение filterByData от psycho brm до jQuery.
Если предыдущее расширение выполняло поиск по паре ключ-значение, с этим расширением вы можете дополнительно искать наличие атрибута данных независимо от его значения.
Применение:
Показать фрагмент кода
Или скрипка: http://jsfiddle.net/PTqmE/46/
источник
Без JQuery, ES6
Я знаю, что вопрос касается JQuery, но читатели могут захотеть использовать чистый метод JS.
источник
Я столкнулся с той же проблемой при получении элементов с использованием атрибутов jQuery и data- *.
поэтому для вашей справки самый короткий код здесь:
Это мой HTML-код:
Это мой селектор jQuery:
источник
Я надеюсь, что это может работать лучше
Спасибо
источник
Этот селектор
$("ul [data-slide='" + current +"']");
будет работать для следующей структуры:Пока это
$("ul[data-slide='" + current +"']");
будет работать для:<ul data-slide="item"><li></li></ul>
источник
Возвращаясь к его первоначальному вопросу о том, как заставить это работать, не зная заранее типа элемента, следующее делает это:
источник