আমি কীভাবে jQuery ব্যবহার করে একটি ডিভের উপাদানগুলির মাধ্যমে শিশুদের মধ্যে পুনরাবৃত্তি করব?

Question

আমার একটি ডিভ রয়েছে এবং এতে বেশ কয়েকটি ইনপুট উপাদান রয়েছে ... আমি সেই উপাদানগুলির প্রত্যেকটির মাধ্যমে পুনরাবৃত্তি করতে চাই। ধারনা?

Answer 1

ব্যবহার করুন children()এবং each(), আপনি বিকল্প হিসাবে কোনও নির্বাচককে পাস করতে পারেনchildren

$('#mydiv').children('input').each(function () {
    alert(this.value); // "this" is the current element in the loop
});

আপনি কেবলমাত্র তাত্ক্ষণিক শিশু নির্বাচনকারীকে ব্যবহার করতে পারেন:

$('#mydiv > input').each(function () { /* ... */ });

Comments

তারপরে লুপের "বর্তমান" আইটেমটি অ্যাক্সেস করতে ক্লোজারের মধ্যে $ (এটি) ব্যবহার করুন।

— amarsuperstar

@আমারসুপারস্টার: ঠিক এই তথ্যটি যোগ করার প্রক্রিয়াতে ছিলেন :-)

— অ্যান্ডি ই

"এন" এর মানটি জানার কোনও উপায় আছে কি, ধরে নিয়ে $ (এটি) পিতামাতার "এন" তম সন্তান?

— সৌভিক ঘোষ

@ সৌভিকঘোষ: সূচকটি কলব্যাক ফাংশনের প্রথম আর্গুমেন্ট হিসাবে পাস করা হয়েছে each()। উপরের উত্তরে লিঙ্কযুক্ত দস্তাবেজগুলি পরীক্ষা করুন।

— অ্যান্ডি ই

Answer 2

নির্দিষ্ট উপাদানের মধ্যে সমস্ত উপাদানগুলির মাধ্যমে পুনরাবৃত্তি করাও সম্ভব, তারা কতটা গভীরভাবে বাসা বেঁধে রেখেছে না:

$('input', $('#mydiv')).each(function () {
    console.log($(this)); //log every element found to console output
});

দ্বিতীয় প্যারামিটার '(' # মাইডিভ ') যা jQuery' ইনপুট 'নির্বাচনকারীকে দেওয়া হয়েছে তা প্রসঙ্গে। এক্ষেত্রে প্রতিটি () ধারাটি # এমডিআইডিভ ধারক মধ্যে সমস্ত ইনপুট উপাদানগুলির মাধ্যমে পুনরাবৃত্তি করবে, এমনকি যদি তারা # এমডিভের সরাসরি সন্তান না হয়।

Comments

বাসা বাঁধার কারণে সম্ভবত এই সমাধানটি আমার পক্ষে কাজ করেছে যখন অন্যটি তা করেনি। যে কারণে আমি ভাবব যে এটি সাধারণত ভাল সমাধান।

— arame3333

এই আমি খুঁজছিলাম ছিল। তাদের মানগুলি থেকে জেসন তৈরির কোনও উপায়? আমি জেসন হিসাবে সমস্ত থিম পোস্ট করতে হবে।

— মুহাম্মদ সাকিব

Answer 3

আপনার যদি পুনরাবৃত্তভাবে শিশু উপাদানগুলির মধ্য দিয়ে লুপ করতে হয় :

function recursiveEach($element){
    $element.children().each(function () {
        var $currentElement = $(this);
        // Show element
        console.info($currentElement);
        // Show events handlers of current element
        console.info($currentElement.data('events'));
        // Loop her children
        recursiveEach($currentElement);
    });
}

// Parent div
recursiveEach($("#div"));   

---

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

Answer 4

এটি পাশাপাশি করা যেতে পারে:

$('input', '#div').each(function () {
    console.log($(this)); //log every element found to console output
});

Answer 5

$('#myDiv').children().each( (index, element) => {
    console.log(index);     // children's index
    console.log(element);   // children's element
 });

সমস্ত বাচ্চাদের মধ্যে এটি পুনরুক্ত হয় এবং সূচক মান সহ তাদের উপাদানগুলি যথাক্রমে উপাদান এবং সূচক ব্যবহার করে পৃথকভাবে অ্যাক্সেস করা যায় ।

Answer 6

শিশু () নিজেই একটি লুপ।

$('.element').children().animate({
'opacity':'0'
});

Answer 7

আমি মনে করি না যে আপনার ব্যবহার করা দরকার each(), আপনি লুপের জন্য মান ব্যবহার করতে পারেন

var children = $element.children().not(".pb-sortable-placeholder");
for (var i = 0; i < children.length; i++) {
    var currentChild = children.eq(i);
    // whatever logic you want
    var oldPosition = currentChild.data("position");
}

এইভাবে আপনার মতো লুপ বৈশিষ্ট্যের মান থাকতে পারে breakএবং এটি continueডিফল্টরূপে কাজ করে

এছাড়াও debugging will be easier

Comments

আমার অভিজ্ঞতাটি হ'ল লুপের $.each()চেয়ে সবসময় ধীর forএবং এটিই কেবল উত্তর এটি ব্যবহার করে। এখানে কীটি হ'ল অ্যারের .eq()মধ্যে প্রকৃত উপাদানটি অ্যাক্সেস childrenকরতে ব্র্যাকেট ( []) স্বরলিপি নয় not

— এলপাস্টার