jquery ক্লাসের সাথে নিকটতম পূর্ববর্তী সহোদর সন্ধান করে

Question

এখানে আমি কাজ করতে চাই মোটামুটি এইচটিএমএল:

<li class="par_cat"></li>
<li class="sub_cat"></li>
<li class="sub_cat"></li>
<li class="par_cat"></li> // this is the single element I need to select
<li class="sub_cat"></li>
<li class="sub_cat"></li>
<li class="sub_cat current_sub"></li> // this is where I need to start searching
<li class="par_cat"></li>
<li class="sub_cat"></li>
<li class="par_cat"></li>

আমার কাছ থেকে পাস করতে হবে .current_sub, নিকটতমতমটি খুঁজে পেতে .par_catএবং এটিতে স্টাফ করতে হবে।

.find("li.par_cat")পুরো লোড প্রদান করে .par_cat(পৃষ্ঠাতে আমার প্রায় 30 পেয়েছে)। আমার একককে লক্ষ্য করা দরকার।

সত্যিই কোন টিপস প্রশংসা করবে :)

Comments

বাহ, বিড়ালরা সত্যিই পুরো ইন্টারনেট জুড়ে! এখন আমরা সমান বিড়াল এবং সাব বিড়াল পেয়েছি।

— জেডি স্মিথ

Answer 1

চেষ্টা করুন:

$('li.current_sub').prevAll("li.par_cat:first");

এটি আপনার মার্কআপ দিয়ে পরীক্ষা করেছেন:

$('li.current_sub').prevAll("li.par_cat:first").text("woohoo");

li.par_cat"উহু" দিয়ে নিকটতম পূর্ববর্তীটি পূরণ করবে ।

Comments

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

— দৌলেক্স

আসলে, কিছুটা টেক্সট করার পরে .prev () কয়েকটি ক্ষেত্রে ব্যর্থ হয়েছিল। .prevAll এর সাথে: প্রথমবার, প্রতিটি সময় কাজ করেছে। ধন্যবাদ.

— দৌলেক্স

.prev () কেবল তাত্ক্ষণিক পূর্ববর্তী উপাদানগুলি পরীক্ষা করে। আমি নীচের উত্তরের সাথে জেএসফিডাল উদাহরণ দিয়ে মন্তব্যটি যুক্ত করেছি। চারপাশে দেখার পরে, এটি সর্বোত্তম উত্তর যেমন এটি সমস্ত উপাদানগুলির মধ্যে চক্র রয়েছে তবে এটি সন্ধানের জন্য ফিল্টার ফিল্টার করার জন্য এটি দুটি ফাংশনের প্রয়োজন হয় না।

— ডেভিড হবস

এর অর্থ কি :firstপ্রত্যাবর্তিত উপাদানগুলির তালিকায় কাজ করছে যা নির্বাচিত বস্তুর নিকটে শুরু হয় (পৃষ্ঠার সাথে নীচে থেকে নীচে বিপরীতে)?

— এনআরিলিংহ

খুব দরকারী উত্তরের জন্য আপনাকে অনেক ধন্যবাদ। আপনি কি দয়া করে @ এনআরিলিংহ প্রশ্নের উত্তর দিতে পারেন কারণ এটি আমাকে সত্যই বিভ্রান্ত করে। নয় :firstএকটি CSS নির্বাচনকারী যে নির্বাচন প্রথম উপাদান করে DOM (যেমন div.red:firstপ্রথম লাল DIV নির্বাচন করব করে DOM ) jQuery নির্বাচক ভিন্নভাবে বিশ্লেষণ করেছিলেন?

— হিসাবরক্ষক

Answer 2

চেষ্টা

$('li.current_sub').prev('.par_cat').[do stuff];

Comments

কিসের অপেক্ষা? এটি কেবল তাত্ক্ষণিক পূর্ববর্তী উপাদানগুলি পরীক্ষা করে না? সুতরাং আপনার কোড নাল ফিরে হবে? - এখানে এটি জেএসফিডালে পরীক্ষা করা হয়েছে: jsfiddle.net/Y2TEH

— ডেভিড

@ ডেভিডহবস আমি এটি দু'বছর আগে লিখেছিলাম .... আমি অবশ্যই আজকাল সমস্ত () ব্যবহার করব।

— এড জেমস

@ অ্যাডউডকক আপনার ক্ষেত্রে উত্তরটি আপডেট করার বিষয়ে বিবেচনা করুন।

— হুগো জিংক

Answer 3

PrevUntil () ব্যবহার করা আমাদের সমস্ত কিছু না পেয়েই দূর ভাইবোন পেতে দেয়। আমার একটি বিশেষত দীর্ঘ সেট ছিল যা প্রপল () ব্যবহার করে খুব সিপিইউ নিবিড় ছিল।

var category = $('li.current_sub').prev('li.par_cat');
if (category.length == 0){
  category = $('li.current_sub').prevUntil('li.par_cat').last().prev();
}
category.show();

এটি মেলে থাকলে এটি প্রথম পূর্ববর্তী সহোদরতা পায়, অন্যথায় এটি মিলিত ভাইয়ের পূর্ববর্তী ভাইবালকে পেয়ে যায়, তাই আমরা কাঙ্ক্ষিত উপাদানটি পেতে কেবল প্রড () দিয়ে আরও একটি ব্যাক আপ করি।

Answer 4

আমি মনে করি সমস্ত উত্তরগুলির কিছু অভাব আছে। আমি এই জাতীয় কিছু ব্যবহার পছন্দ করি

$('li.current_sub').prevUntil("li.par_cat").prev();

আপনাকে যোগ না করা বাঁচায়: প্রথমে নির্বাচকটির অভ্যন্তরে এবং পড়া এবং বোঝা সহজ। prevUntil () পদ্ধতির prevAll () ব্যবহারের পরিবর্তে আরও ভাল পারফরম্যান্স রয়েছে

Answer 5

আপনি এই কোডটি অনুসরণ করতে পারেন:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
    $(document).ready(function () {
        $(".add").on("click", function () {
            var v = $(this).closest(".division").find("input[name='roll']").val();
            alert(v);
        });
    });
</script>
<?php

for ($i = 1; $i <= 5; $i++) {
    echo'<div class = "division">'
        . '<form method="POST" action="">'
        . '<p><input type="number" name="roll" placeholder="Enter Roll"></p>'
        . '<p><input type="button" class="add" name = "submit" value = "Click"></p>'
        . '</form></div>';
}
?>

আপনি এ থেকে ধারণা পেতে পারেন।