jQuery ডেটা অ্যাট্রিবিউট মান দ্বারা উপাদান সন্ধান করে


108

আমার নীচের মতো কয়েকটি উপাদান রয়েছে:

<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');

কোন ধারণা?


4
এখানে কিছু বিষয় ব্যাখ্যা করার জন্য, এটি কাজ না করার কারণ হ'ল কারণ আপনি এর .slide-linkগুণাবলী সহ বংশধরদের সন্ধান করার চেষ্টা করছেন [data-slide="0"]। যেহেতু কোনও কিছু নিজের বংশধর হতে পারে না, তাই এর ফিরে আসার মতো কিছুই নেই। যাইহোক, যদি এই লিঙ্কগুলির চারপাশে আপনার একটি মোড়ক থাকে, তবে এটি কাজ করতে পারে:$('.slide-link-wrapper').find('[data-slide="0"]').addClass('active');
ডোনডেস্টা মাইকুলি

আরও দেখুন stackoverflow.com/q/4191386/292060
goodeye

উত্তর:


233

অ্যাট্রিবিউট ইক্যুয়াল সিলেক্টর ব্যবহার করুন

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

Fiddle Demo

.অনুসন্ধান()

এটা গাছ নিচে কাজ করে

কোনও নির্বাচক, জিকুয়ারি বস্তু বা উপাদান দ্বারা ফিল্টার করা মিলের উপাদানগুলির বর্তমান সেটে প্রতিটি উপাদানের বংশধরকে পান।


4
আমার খারাপ। আমি চেষ্টা করেছিলাম কিন্তু ভুল জায়গায় (আমার উপাদানগুলিকে গতিশীলভাবে যুক্ত করার আগে ...)। যাইহোক প্রচেষ্টা জন্য ধন্যবাদ! ঠিকভাবে কাজ করে.
মিস্টার ইউপিডাউন

@ মিআরসিপডাউন আপনাকে সাহায্য করতে খুশি :)
তুষার গুপ্ত - কুরিউস্তুশার

4
কি দারুন! এই সমাধান মহান! কয়েক ঘন্টা সমস্যা ছিল তবে এটি এটি স্থির করেছে!

var slidernumber = "0";ধ্রুবকের পরিবর্তে আমি কীভাবে এটি একটি পরিবর্তনশীল মানের সাথে সমান করব "0"?
টনি গিল

যদি কোনও কারণে আপনি সেখানে নির্দিষ্ট শ্রেণীর উপস্থিতির উপর নির্ভর করতে না পারেন তবে আপনি ঠিক প্রথম বিভাগের জন্য wild ('* [ডেটা-স্লাইড = "0"]') এর মতো ওয়াইল্ডকার্ড ব্যবহার করতে পারেন addডক্লাস ('সক্রিয়') ;
শানমিসি


6

আমি স্ট্রিংয়ের পরিবর্তে ভেরিয়েবলের সাথে একই সমাধানটি অনুসন্ধান করেছি।
আমি আশা করি আমি আমার সমাধানে কাউকে সাহায্য করতে পারি :)

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>

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.