Qu jquery.data () রয়েছে এমন সমস্ত উপাদান Jquery নির্বাচন করুন

Question

আমি পূর্বে সেট করে রেখেছি এমন উপাদান নির্বাচন করুন jquery.data();

.data('myAttr')ইতোমধ্যে সেট করা সমস্ত উপাদান নির্বাচন করুন ।

সমাধান

ডিস্টোস্ট্রেট করার জন্য একটি জিসফ্লাল হলেন ফিডল

Answer 1

আপনি করতে পারেন

$('[data-myAttr!=""]'); 

এটি এমন সমস্ত উপাদান নির্বাচন করে যার একটি বৈশিষ্ট্য রয়েছে data-myAttrযা '' এর সমান নয় (সুতরাং এটি অবশ্যই সেট করা থাকতে পারে);

আপনি ফিল্টারও ব্যবহার করতে পারেন ()

$('*').filter(function() {
    return $(this).data('myAttr') !== undefined;
});

Comments

বা কেবল:$('[data-myAttr]')

— andlrc

একই জিনিস ভেবেছি। এটি প্রত্যাশার মতো কাজ করে না। দেখতে এই ডেমো

— gdoron মনিকা সমর্থন করছে

কোডের প্রথম টুকরোতে একটি ক্লোজিং অনুপস্থিত (সরাসরি উত্তর সম্পাদনা করতে পারে না)

— ফ্লোরেন্ট ২২

; ('[ডেটা-মাইআটার! = ""]'); যে উপাদানগুলিকে বরাদ্দ করা হয়নি তা ফিরিয়ে দেবে। @ নুলের মন্তব্য কেবলমাত্র সেগুলি সেট করে এমন উপাদানগুলি পায়।

— আর্লেসলি

ভুল! সঠিক সমাধান: $ ('[ডেটা-মাইআউটআর]') - ব্যাখ্যার জন্য নীচের উত্তরটি দেখুন

— বাসমএইচএল

Answer 2

এগুলি নির্বাচন করার সর্বোত্তম এবং সহজ উপায় হ'ল:

$('[data-myAttr]')

অধিক তথ্য:

আমি অনেক কিছুর পরীক্ষা করেছি।

ব্যবহার $('[data-myAttr!=""]')সব ক্ষেত্রে কাজ করে না। কারণ যে উপাদানগুলির একটি data-myAttrসেট নেই, তাদের data-myAttrসমান হবে undefinedএবং $('[data-myAttr!=""]')সেগুলিও নির্বাচন করবে, যা ভুল।

Comments

এটি কেবল মার্কআপে সংজ্ঞায়িত ডেটা অ্যাট্রিবিউটগুলির সাথে কাজ করে। এটি jQuery এর মাধ্যমে সংজ্ঞায়িত ডেটা অ্যাট্রিবিউটগুলির সাথে কাজ করে না, jsfiddle.net/2p7h0Lj8/1 দেখুন

— সোফিভাইরাস

Answer 3

আপনি ফিল্টার () ব্যবহার করতে পারেন :

var elements = $("*").filter(function() {
    return $(this).data("myAttr") !== undefined;
});

Comments

এটি পোস্ট করার কথা ছিল, এটির কাজটি দেখানোর জন্য এখানে একটি ঝাঁকুনি

— ররি ম্যাকক্রসন

গুণবাচক নির্বাচক কাজটি করেন না কেন? $('[data-myAttr]')?

— gdoron মনিকা 24

@ জিডোরন, কারণ এটির গেটর data()ফর্মটি সত্যই এইচটিএমএল 5 data-বৈশিষ্ট্যগুলি পড়ে না , তবে এর সেটার ফর্মটি তাদের তৈরি করে না এবং আপডেটও করে না।

— ফ্রেডরিক হামিদি

উম্মম, তাহলে এটি ডেটা কোথায় বাঁচায়? আপনি আমার রেফারেন্স দিতে পারেন? আমি এটি "(সমস্ত ডেটা মানগুলি পরে jQuery এ অভ্যন্তরীণভাবে সংরক্ষণ করা হয়) পড়েছি ।" কিন্তু যেখানে???

— gdoron মনিকা 24

@ জিডোরন, ডেটা একটি বিশ্বব্যাপী ক্যাশে অব্যাহত রয়েছে, একটি আইডি দ্বারা চালিত যা প্রসারিত সম্পত্তির মাধ্যমে উপাদানটির সাথে সম্পর্কিত।

— ফ্রেডরিক হামিদি

Answer 4

আপনি এই jQuery সিলেক্টর এক্সটেনশন ব্যবহার করতে পারেন: উপাদান ডেটা অনুসন্ধান করছে

$(':data');       // All elements with data  
$(':not(:data)'); // All elements without data

Comments

jQuery UI এর এটি ইতিমধ্যে রয়েছে তাই কারও কারও কাছে বেনামে ফাংশন কল করার প্রয়োজন নাও হতে পারে। api.jqueryui.com/data-setector

— arleslie

Answer 5

আপনি JQuery UI ব্যবহার করতে পারেন : ডেটা () নির্বাচকের সাথে

নির্দিষ্ট কীগুলির অধীনে ডেটা সঞ্চিত উপাদান নির্বাচন করে।

একটি উদাহরণের জন্য এই jsfiddle দেখুন

সমস্ত উপাদান মেলে পেতে .data('myAttr')আপনি ব্যবহার করতে পারেন

var matches = $(':data(myAttr)');

এটি data-বৈশিষ্ট্যযুক্ত উপাদান এবং উপাদানগুলি সংরক্ষণ করে ডেটা ব্যবহার করে $.data()কারণ উভয়ের জন্য কাজ করা উচিত

JQuery 1.4.3 হিসাবে এইচটিএমএল 5 তথ্য- বৈশিষ্ট্যগুলি স্বয়ংক্রিয়ভাবে jQuery এর ডেটা অবজেক্টে টানা হবে।

তবে এটি খুব ভাল কাজ করে না। পরীক্ষা করে দেখুন এই jsfiddle এবং আপনি সেই দ্বিতীয় সময় নির্বাচক এটি 2 উপাদান সুসংগত হওয়া আবশ্যক বলা হয় এবং শুধুমাত্র এক মেলা দেখতে হবে। এটি jquery-ui লাইব্রেরিতে "একটি বাগ" এর কারণে।

এটি মূল jquery-ui ফাইল থেকে নেওয়া হয়েছে।

 $.extend( $.expr[ ":" ], {
    data: $.expr.createPseudo ?
        $.expr.createPseudo(function( dataName ) {
            return function( elem ) {
                return !!$.data( elem, dataName );
            };
        }) :
        // support: jQuery <1.8
        function( elem, i, match ) {
            return !!$.data( elem, match[ 3 ] );
        }
});

আপনি দেখতে পাচ্ছেন যে তারা বৈশিষ্ট্যযুক্ত উপাদানগুলির জন্য অনুরোধ করছেন এমন ক্ষেত্রে $.data(elem, match)পরিবর্তে তারা ব্যবহার করছে $(elem).data(match)যা ক্যাশে আপডেট হওয়ার data-কারণ নয়। যদি উপাদানটি data()স্টোরেজ করার জন্য পরীক্ষা করা হয় তবে এটি ভাল কাজ করে তবে তা না হলে এটি ফলাফলের ম্যাচগুলিতে অন্তর্ভুক্ত হবে না।

আপনি যা চান তা কেবলমাত্র আপনার দ্বারা নির্ধারিত ডেটা তথ্যের সাথে উপাদানগুলির সাথে মেলে তবে আপনি যদি দুটি বিকল্প না রেখে থাকেন তবে এটি কোনও ত্রুটি হতে পারে না।

1. Jquery-ui ব্যবহার করবেন না এবং আপনার নিজস্ব সিউডো-সিলেক্টর প্রসারিত করুন $(:mydata(myAttr))

   $.extend($.expr[":"], {
      mydata: $.expr.createPseudo ?
      $.expr.createPseudo(function(dataName) {
         return function(elem) {
            return !!$(elem).data(dataName);
         };
      }) : function(elem, i, match) {
          return !!$(elem).data(match[3]);
      }
   });
   

    // pseudoselector code
    $.extend($.expr[":"], {
      mydata: $.expr.createPseudo ?
        $.expr.createPseudo(function(dataName) {
          return function(elem) {
            return !!$(elem).data(dataName);
          };
        }) : function(elem, i, match) {
          return !!$(elem).data(match[3]);
        }
    });
    // end pseudoselector
   
    testSelector = function() {
      var matched = $(':mydata(test)'),
        results = $('#results');
      results.append('<div>You matched ' + matched.length + ' elements</div>');
      matched.css('border', 'black 3px solid');
      console.log(matched);
      console.log('You matched ' + matched.length + ' elements');
    };
   
    testSelector();
    $('#addData').click(function() {
      $(".bar").data('test', 'value2');
      testSelector();
    });
   
    

    .foo {
      background-color: red;
      color: white;
    }
    .bar {
      background-color: blue;
      color: white;
    }
    #addData {
      margin-top: 20px;
    }
   
    

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div>
      <span class="bar">without data attribute</span>
      <span class="foo" data-test="value1">with data attribute</span>
    </div>
    <button id="addData" type="button">Add data</button>
    <div id="results"></div>
   
    

2. :dataসিউডোজেক্টর সহ jquery-ui ব্যবহার করুন এবং [data-myAttr]এড়িয়ে যাওয়া হতে পারে এমনগুলি অন্তর্ভুক্ত করার জন্য নির্বাচনের ফলাফলগুলিতে যোগদান করুন

   var matches = $(':data(myAttr)', '[data-myAttr]')
   

    testSelector = function() {
      var matched = $(':data(test), [data-test]'),
          results = $('#results');
      results.append('<div>You matched ' + matched.length + ' elements</div>');
      matched.css('border', 'black 3px solid');
      console.log(matched);
      console.log('You matched ' + matched.length + ' elements');
    };
   
    testSelector();
    $('#addData').click(function() {
      $(".bar").data('test', 'value2');
      testSelector();
    });
   
    

    .foo {
      background-color: red;
      color: white;
    }
    .bar {
      background-color: blue;
      color: white;
    }
    #addData {
      margin-top: 20px;
    }
   
    

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <div>
      <span class="bar">without data attribute</span>
      <span class="foo" data-test="value1">with data attribute</span>
    </div>
    <button id="addData" type="button">Add data</button>
    <div id="results"></div>
   
    

Comments

এটি আসল আইডি বা ডেটা অ্যাট্রিবিউট নামটি না জেনে ডেটা- অ্যাট্রিবিউটসের সাথে উপাদান নির্বাচন করার আমার সমস্যার সমাধানের অংশ ছিল। আমি অন্য কোথাও এটি করার জন্য jQuery প্রসারিত করার উপায় খুঁজে পেয়েছি তবে কোড স্নিপেট ব্যবহারিক প্রয়োগ দেখানোর জন্য এখানে +1 করেছেন। অন্যরা ইঙ্গিত দেওয়ার জন্য যথেষ্ট পরিমাণে সরবরাহ করে তবে কখনও কখনও আপনাকে প্রদত্ত তথ্য কীভাবে ব্যবহার করতে হয় তা দেখাতে হবে। ধন্যবাদ! :)

— ব্র্যান্ডন এলিয়ট

Answer 6

$('[data-myAttr]').each(function() {
       var element = $(this);
       // Do something with the element
});

Answer 7

আমি পূর্বে সেট করে রেখেছি এমন উপাদান নির্বাচন করুন jquery.data();

---

প্রশ্নটি কোনও নির্দিষ্ট কী সহ সমস্ত উপাদান সন্ধান করার জন্য এবং কোনও ডেটা নয়।

---

ব্যবহার করার চেষ্টা করুন jQuery.data()

$(".myClass").each(function(i){
    if( i % 2 == 0 ){
        $(this).data("myAttr",i + 1);                
    }
});
    
var res = $(".myClass").map(function(i) {
    console.log($(this).data("myAttr"));
    return $.data(this, "myAttr") !== undefined ? this : null
});    

console.log(res);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div class="myClass">1</div>
<div class="myClass">2</div>
<div class="myClass">3</div>
<div class="myClass">4</div>
<div class="myClass">5</div>

জেএসফিল http://jsfiddle.net/xynZA/142/

Comments

উত্তরের জন্য ধন্যবাদ। প্রশ্নটি কোনও নির্দিষ্ট কী সহ সমস্ত উপাদান সন্ধান করার জন্য এবং কোনও ডেটা নয়।

— আর্গিরোপল্লোস স্ট্যাভ্রোস

@ আরগিরোপ্লোস স্ট্যাভ্রসগুলিতে html data-*বৈশিষ্ট্য সেট, পাশাপাশি সেট থাকা উপাদানগুলি কী ফেরত দেওয়া দরকার jQuery.data()?

— অতিথি 271314