Öğeyi .data () anahtarına / değerine göre filtrele

Diyelim .navlinkki, tıklandığında, .data()çağrılan bir anahtarı şu 'selected'değere ayarlamak için kullanılan sınıflı 4 div öğem var true:

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

Her .navlinkyenisine tıklandığında, navlinkdaha sonra işlemek için önceden seçilmiş olanı saklamak istiyorum . Neyi kullanarak depolandığına göre bir öğeyi seçmenin hızlı ve kolay bir yolu var mı .data()?

Görünüşe göre faturaya uyan jQuery : filtreleri yok ve aşağıdakileri denedim (aynı tıklama olayında), ancak bazı nedenlerden dolayı çalışmıyor:

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

Bunu başarmanın başka yolları da olduğunu biliyorum, ama şu anda çoğunlukla sadece bu yolla yapılıp yapılamayacağını merak ediyorum .data().

filtreniz çalışır, ancak onları yakalaması için filtreye geçirilen işlevdeki eşleşen nesneler üzerinde true döndürmeniz gerekir.

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

Sadece kayıt için, sen yapabilirsiniz (o sıra bu çözümü yazmak için doğru olması için, bu soru oldukça eskidir ve jQuery o zamandan beri gelişti) jquery ile verilere filtre:

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

veya daha iyisi (performans için):

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

veya tüm öğeleri data-selectedset ile almak istiyorsanız :

$('[data-selected]')

Bu yöntemin yalnızca html-öznitelikleri aracılığıyla ayarlanmış verilerle çalışacağını unutmayın . .data()Çağrı ile veri ayarlar veya değiştirirseniz , bu yöntem artık çalışmayacaktır.

Bir eklentiyi oldukça kolay bir şekilde yapabiliriz:

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

Kullanım (bir radyo düğmesini kontrol ederek):

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

Fark ettiğim iki şey (yazdığın zamanki hatalar olabilirler).

1. İlk örnekte bir noktayı kaçırdınız ( $('.navlink').click )
2. Filtrenin çalışması için bir değer ( return $(this).data("selected")==true) döndürmeniz gerekir

Değerinden daha fazla iş gibi görünüyor.

1) Neden şu anda seçili öğe \ jQuery nesnesine bir başvuru depolayan tek bir JavaScript değişkenine sahip değilsiniz?

2) Seçili öğeye neden bir sınıf eklemiyorsunuz? Ardından DOM'u ".active" sınıfı veya başka bir şey için sorgulayabilirsiniz.