.ডাটা () কী / মানের উপর ভিত্তি করে ফিল্টার উপাদান

Question

বলুন আমার ক্লাস সহ 4 টি ডিভ উপাদান রয়েছে .navlink, যখন ক্লিক করা হয় তখন একটি মান হিসাবে .data()একটি চাবি সেট করতে ব্যবহার করে :'selected'true

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

প্রত্যেকবার যখন কোনও নতুন .navlinkক্লিক করা হয়, আমি navlinkপরে হেরফের জন্য পূর্বে নির্বাচিত সংরক্ষণ করতে চাই । কী ব্যবহার করে সংরক্ষণ করা হয়েছিল তার উপর ভিত্তি করে কোনও উপাদান নির্বাচন করার দ্রুত এবং সহজ উপায় আছে .data()?

কোনও jQuery বলে মনে হচ্ছে না : বিলেগুলির সাথে মাপসই ফিল্টারগুলি এবং আমি নিম্নলিখিতগুলি চেষ্টা করেছি (একই ক্লিক ইভেন্টের মধ্যে), কিন্তু কোনও কারণে এটি কার্যকর হয় না:

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

আমি জানি যে এটি সম্পাদন করার অন্যান্য উপায় আছে, তবে এখনই বেশিরভাগ ক্ষেত্রে আমি আগ্রহী যদি এটির মাধ্যমে সম্পন্ন করা যায় .data()।

Answer 1

আপনার ফিল্টারটি কাজ করবে, তবে ফিল্টারটিতে ফাংশনটি মেশানো অবজেক্টগুলিকে সেগুলি ধরার জন্য আপনাকে সত্যটি ফিরিয়ে আনতে হবে।

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

Comments

দয়া করে মনে রাখবেন যে এটি আর করার একমাত্র উপায় নয়, স্টেফানো পি বিকল্প সরবরাহ করেছে

— নাথান কোপ

@ নাথানকুপ, বেশ নয় তার উত্তর সম্পর্কে আমার মন্তব্য দেখুন।

— ব্রায়ান ডাউনিং

যারা ডকুমেন্টের যে কোনও স্থানে অন্যথায় অনিবার্য উপাদান (আইডি কম ডিভিডস ইত্যাদি ... যে কোনও কারণেই আপনার অ্যাক্সেস করতে সক্ষম হওয়া দরকার) খোঁজার জন্য ডেটা অ্যাট্রিবিউটটি ব্যবহার করেন:$("*").filter(function() { return $(this).data("DATA IDENTIFIER HERE") == DATA VALUE HERE; });

— স্যাশাল্লাকা

এটি "অগোছালো" নয় - বাকী নির্বাচকের সাথে অনুসন্ধানের শব্দটি মিলিয়ে কোনও অবৈধ নির্বাচনকারী তৈরি না করে তা নিশ্চিত করার জন্য আপনি সেই মানগুলি "পলায়ন" না করেই নির্বিচারে শর্তে ফিল্টার করার একমাত্র নিরাপদ উপায়।

— Alnitak

Answer 2

কেবল রেকর্ডের জন্য, আপনি jquery এর সাহায্যে ডেটা ফিল্টার করতে পারেন (এই প্রশ্নটি বেশ পুরানো, এবং তখন থেকেই jQuery বিকশিত হয়েছে, সুতরাং এই সমাধানটিও লিখতে হবে):

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

বা, আরও ভাল (পারফরম্যান্সের জন্য):

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

অথবা, আপনি যদি data-selectedসেট সহ সমস্ত উপাদান পেতে চান :

$('[data-selected]')

নোট করুন যে এই পদ্ধতিটি কেবলমাত্র এইচটিএমএল-অ্যাট্রিবিউটগুলির মাধ্যমে সেট করা ডেটার সাথে কাজ করবে। আপনি যদি .data()কল দিয়ে ডেটা সেট বা পরিবর্তন করেন তবে এই পদ্ধতিটি আর কাজ করবে না।

Comments

যদি এই উত্তর ভয় পাই কম ভোট আপনি - এটি একটি কার্যত অভিন্ন প্রশ্নের জন্য 100+ ভোট দিয়ে গৃহীত উত্তর stackoverflow.com/questions/4146502

— Simon_Weaver

-1 .data()কোনও data-বৈশিষ্ট্যের পরিবর্তে পদ্ধতিতে ডেটা সেট করা হলে এটি কাজ করে না । এই ফ্রিডলটি দেখুন: jsfiddle.net/bryandowning/tySWC - এছাড়াও, .find()পদ্ধতিটি পূর্ববর্তী নির্বাচকের বাচ্চাদের জন্য অনুসন্ধান করে। প্রদত্ত উদাহরণে, data-selectedএর একটি বৈশিষ্ট্য .navlink, কোনও সন্তানের নয় .navlink। এছাড়াও, $('div p')এবং $('div').find('p')মূলত সমতুল্য। ব্যবহার করে .find()মনে হচ্ছে অতিরিক্ত ফাংশন কলের কারণে এটি ধীর হতে পারে (যদিও আমি এটি সম্পর্কে ইতিবাচক নই)। আমি যদি এর কোনটি সম্পর্কে ভুল হয়ে থাকে তবে দয়া করে আমাকে সংশোধন করুন (আমি সত্যই এই পদ্ধতিটি কাজ করতে চাই)।

— ব্রায়ান ডাউনিং

কয়েকটি জিনিস: ১) আপনি ঠিক বলেছেন যে আপনি যদি ডেটা সেট করে থাকেন তবে এটি কাজ করে না .data(), যেহেতু jQuery DOM এর মাধ্যমে অনুসন্ধান করে, আমি তাদের জন্য পোস্ট করেছি (আমার মতো) যারা অন্যান্য কারণে এই প্রশ্নে এসেছেন; 2) সঠিক, .find()বাচ্চাদের মাধ্যমে অনুসন্ধান করে, তাই এই উদাহরণে এটি ভুল; 3) আপনি ভুল, এগুলি সমতুল্য নয়, যেহেতু jQuery ডান থেকে বামে অনুসন্ধান করে, দেখুন jonraasch.com/blog/…

— স্টেফানো পি

উপরে ভোট দিন $('[data-selected]')এটির মতো কিছুতে আমাকে সাহায্য করেছিল$('ul.categories a[data-categories_id]').click(......);

— লূক কাজিন্স

এছাড়াও, মনে হয় আপনি .attr ব্যবহার করে ডেটা অ্যাট্রিবিউট আপডেট করে থাকেন, যদি আপনি এটি ব্যবহার করে এটি পুনরুদ্ধার করেন তবে ডেটা মান আপডেট হবে না - তাই দুটি মিশ্রিত করার সময় সাবধানতা অবলম্বন করুন

— ফ্যাবিও লোলি

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

Comments

আপনি প্লাগইন পদ্ধতিটি বোঝাচ্ছেন অন্যথায় এটি গৃহীত উত্তর হিসাবে একই ...

— jave.web

@ জাভ.ওয়েব তবে কীভাবে এটি প্লাগিনে রূপান্তর করা যায় তা সকলেই জানেন না। ভার্ভেজ আপডেট করা হয়েছে।

— এমপেন

আমাকে ভুল করবেন না, আপনার উত্তর দুর্দান্ত, তবে এখানে শব্দগুলি খুব গুরুত্বপূর্ণ, আপডেটের জন্য আপনাকে ধন্যবাদ :)

— jave.web

Answer 4

দুটি জিনিস আমি লক্ষ্য করেছি (যদিও আপনি এটি লিখেছিলেন সেগুলি থেকে তারা ভুল হতে পারে)।

1. আপনি প্রথম উদাহরণে একটি বিন্দু মিস করেছেন ( $('.navlink').click)
2. ফিল্টার কাজ করার জন্য আপনাকে একটি মান ( return $(this).data("selected")==true) ফেরত দিতে হবে

Answer 5

এর চেয়ে বেশি কাজের মতো মনে হচ্ছে।

1) কেন কেবলমাত্র একটি একক জাভাস্ক্রিপ্ট ভেরিয়েবল নেই যা বর্তমানে নির্বাচিত উপাদান \ jQuery অবজেক্টের রেফারেন্স সঞ্চয় করে।

2) বর্তমানে নির্বাচিত উপাদানগুলিতে কোনও শ্রেণি যুক্ত করা হবে না কেন। তারপরে আপনি ".অ্যাকটিভ" শ্রেণি বা কোনও কিছুর জন্য ডিওএমকে জিজ্ঞাসা করতে পারেন।

Comments

হ্যাঁ, তবে যেমনটি আমি বলেছিলাম, আমি জানি এটি সম্পাদন করার অন্যান্য উপায় ছিল were এটি ডেটা () এর মাধ্যমে ফিল্টার করা যায় কিনা এবং ফিল্টার () কেন আমার পক্ষে কাজ করছে না তা নিয়ে আমি কেবল আটকে ছিলাম। ধন্যবাদ যদিও.

— ব্যবহারকারী 113716

দুঃখিত। আমি আপনার প্রশ্নের সেই অংশটি মিস করেছি।

— ব্রায়ান মিগলিওরিসি