डेटा विशेषता मान द्वारा jQuery तत्व खोजें


103

मेरे पास नीचे जैसे कुछ तत्व हैं:

<a class="slide-link" href="#" data-slide="0">1</a>
<a class="slide-link" href="#" data-slide="1">2</a>
<a class="slide-link" href="#" data-slide="2">3</a>

मैं उस तत्व के वर्ग को कैसे जोड़ सकता हूं जिसका data-slideगुण मान 0(शून्य) है?

मैंने कई अलग-अलग समाधानों की कोशिश की है लेकिन कुछ भी काम नहीं आया। एक उदाहरण:

$('.slide-link').find('[data-slide="0"]').addClass('active');

कोई उपाय?


2
यहां चीजों को थोड़ा समझाने के लिए, यह काम नहीं करता है, इसका कारण यह है कि आप .slide-linkकी विशेषता के साथ वंशज को खोजने की कोशिश कर रहे हैं [data-slide="0"]। चूँकि कुछ स्वयं का वंशज नहीं हो सकता, इसलिए उसके पास वापस लौटने के लिए कुछ भी नहीं है। हालाँकि, अगर आपके पास इन कड़ियों के आसपास एक रैपर होता, तो यह काम करता:$('.slide-link-wrapper').find('[data-slide="0"]').addClass('active');
डोंडेएस्टीमैको

यह भी देखें stackoverflow.com/q/4191386/292060
goodeye

जवाबों:


224

विशेषता बराबर चयनकर्ता का उपयोग करें

$('.slide-link[data-slide="0"]').addClass('active');

Fiddle Demo

.find ()

यह पेड़ के नीचे काम करता है

चयनित तत्व के वर्तमान सेट में प्रत्येक तत्व के वंशज प्राप्त करें, एक चयनकर्ता, jQuery ऑब्जेक्ट या तत्व द्वारा फ़िल्टर किया गया।


2
मेरी गलती। मैंने कोशिश की थी कि गलत जगह पर (अपने तत्वों को गतिशील रूप से जोड़ने से पहले ...)। वैसे भी प्रयास के लिए धन्यवाद! ठीक काम करता है।
MrUpsidown

@MrUpsidown मदद करने के लिए आपका स्वागत है :) :)
तुषार गुप्ता - करिश्मुशार

1
वाह! यह समाधान बहुत अच्छा है! घंटे के लिए एक समस्या थी, लेकिन यह तय!

var slidernumber = "0";स्थिरांक के बजाय मैं इसे चर मान के बराबर कैसे करूं "0"?
टोनी गिल

यदि किसी कारण से आप एक निश्चित वर्ग पर निर्भर नहीं रह सकते हैं तो आप इस $ ('* [डेटा-स्लाइड = "0"]) जैसे पहले भाग के लिए एक वाइल्डकार्ड का उपयोग कर सकते हैं।) AddClass (' सक्रिय ') ;
17


5

मैंने स्ट्रिंग के बजाय एक ही समाधान के लिए एक चर के साथ खोज की।
मुझे आशा है कि मैं अपने समाधान के साथ किसी की मदद कर सकता हूं :)

var numb = "3";
$(`#myid[data-tab-id=${numb}]`);

3

आप andSelf()रैपर डोम को प्राप्त करने के लिए विधि का उपयोग भी कर सकते हैं फिर find()अपने विचार के रूप में चारों ओर काम कर सकते हैं

$(function() {
  $('.slide-link').andSelf().find('[data-slide="0"]').addClass('active');
})
.active {
  background: green;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a class="slide-link" href="#" data-slide="0">1</a>
<a class="slide-link" href="#" data-slide="1">2</a>
<a class="slide-link" href="#" data-slide="2">3</a>

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.