Фильтрующий элемент на основе .data() key/value

Скажем, у меня есть 4 элемента div с классом .navlink, которые при нажатии кнопки .data() устанавливают ключ с именем 'selected' на значение true:

$('.navlink')click(function() { $(this).data('selected', true); })

Каждый раз, когда нажимается новый .navlink, я хотел бы сохранить ранее выбранный navlink для более поздних манипуляций. Есть ли простой и простой способ выбора элемента на основе того, что было сохранено с помощью .data()?

Кажется, что нет jQuery : filters, который соответствует счету, и я попробовал следующее (в рамках одного события кликов), но по какой-то причине он не работает:

var $previous = $('.navlink').filter( 
    function() { $(this).data("selected") == true }
);

Я знаю, что есть другие способы сделать это, но сейчас мне просто любопытно, можно ли это сделать через .data().

Ответы

Ответ 1

ваш фильтр будет работать, но вам нужно вернуть true для сопоставления объектов в функции, переданной фильтру, чтобы захватить их.

var $previous = $('.navlink').filter(function() { 
  return $(this).data("selected") == true 
});

Ответ 2

Только для записи вы можете фильтровать данные с помощью jquery (этот вопрос довольно старый, а с тех пор развивается jQuery, поэтому также правильно написать это решение):

$('.navlink[data-selected="true"]');

или, лучше (для производительности):

$('.navlink').filter('[data-selected="true"]');

или, если вы хотите получить все элементы с помощью data-selected set:

$('[data-selected]')

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

Ответ 3

Мы можем сделать функцию довольно легко:

$.fn.filterData = function(key, value) {
    return this.filter(function() {
        return $(this).data(key) == value;
    });
};

Использование (проверка переключателя):

$('input[name=location_id]').filterData('my-data','data-val').prop('checked',true);

Ответ 4

Две вещи, которые я заметил (это могут быть ошибки, когда вы написали это, хотя).

  • Вы потеряли точку в первом примере ($('.navlink').click)
  • Чтобы фильтр работал, вы должны вернуть значение (return $(this).data("selected")==true)

Ответ 5

Звучит как больше работы, чем его ценность.

1) Почему бы просто не иметь одну переменную JavaScript, которая хранит ссылку на текущий выбранный элемент \jQuery.

2) Почему бы не добавить класс к выбранному в данный момент элементу. Затем вы можете запросить DOM для "активного" класса или чего-то еще.