JQuery `ক্লিক`,` bind`, `live`,` প্রতিনিধি, `ট্রিগার` এবং` on` ফাংশন (উদাহরণ সহ) এর মধ্যে পার্থক্য?

Question

আমি প্রতিটি ফাংশনটির ডকুমেন্টেশনটি পড়েছি jQuery official website, তবে নীচের ফাংশনগুলির মধ্যে এমন কোনও তুলনা তালিকা নেই:

$().click(fn)
$().bind('click',fn)
$().live('click',fn)
$().delegate(selector, 'click', fn)
$().trigger('click') // UPDATED
$().on('click', selector ,fn); // more UPDATED

কোনও রেফারেন্স লিঙ্ক এড়াতে দয়া করে।

উপরের সমস্ত ফাংশনগুলি ঠিক কীভাবে কাজ করে এবং কোন পরিস্থিতিতে কোনটি পছন্দ করা উচিত?

দ্রষ্টব্য: যদি অন্য কোনও ফাংশন (গুলি) একই কার্যকারিতা বা প্রক্রিয়াধীন থাকে তবে দয়া করে বিশদভাবে বর্ণনা করুন।

হালনাগাদ

আমি একটি $.triggerফাংশনও দেখেছি । এটি কি উপরের ফাংশনগুলির মতো কাজ করে?

আরও আপডেট

এখন v1.7.on এ যুক্ত করা হয়েছে এবং আমি মনে করি এটি একরকম উপরের সমস্ত ফাংশনগুলির একসাথে আবরণ করে cover

Comments

@ আমি পিএইচপি এর মত, কখনও কখনও লোকেরা বিষয়গুলিকে ভোট দেয় তবে যদি তারা মনে করেন না যে এটি কোনও প্রশ্ন যা ম্যানুয়াল দ্বারা উত্তর দেওয়া যায় না বা হোমওয়ার্কের প্রশ্ন হিসাবে দেখা যায় না। চিন্তা করবেন না, অন্যরা যদি এটিকে দরকারী মনে করে তবে এটি ভোট দেবে।

— টাইপনিয়ারর

@ টাইপোনিয়ারর - সমর্থনের জন্য ধন্যবাদ, আমি ইতিমধ্যে ম্যানুয়ালটি পড়েছি এবং যখন আমি স্পষ্ট পার্থক্য বুঝতে পারি না তখন আমি এখানে পোস্ট করি।

— diEcho

@ আমি পিএইচপি-এর মতো - কিছুটা ক্লিনআপের জন্য প্রশ্ন সম্পাদনা করেছি ... এটি প্রায়শই জিজ্ঞাসা করা হয় তবে খুব কমই এটি সহজেই একটি মূল্যবান গুগল-সক্ষম সংস্থান হতে পারে। আমি সম্মতি জানাই যে এরকম কোনও কিছুর উইকি-ইশ প্রবেশ করা খুব সহায়ক হবে, আমি পুরোপুরি বৈধ প্রশ্নের জন্য , বিশেষত .live()এবং .delegate()প্রায় প্রতিদিনই +1 এর আশেপাশে বিভ্রান্তি দেখি ।

— নিক ক্র্যাভার

@ নিক ক্র্যাভার সম্পাদনার জন্য ধন্যবাদ, প্রকৃতপক্ষে ইংরেজিতে খুব খারাপ (LOL)। কোনও মুনাল / রেফারেন্স আছে কীভাবে আমরা কোনও প্রশ্ন পোস্ট করি SO। এটি ঠিক অভিজ্ঞতার মাধ্যমে এসেছিল

— ডায়াকো

@ আমি পিএইচপি এর মত - এটি উভয়েরই কিছুটা, এখানে এসওএর জন্য একটি দুর্দান্ত চারপাশের প্রায়শই জিজ্ঞাসিত প্রশ্নাবলী: meta.stackexchange.com/questions/7931 বাক্য / মন্তব্যগুলির জন্য, আপনি কেবল কী ফিট করে তা শিখতে শুরু করুন এবং এটি সর্বোত্তম উপায় আপনার চিন্তাভাবনা, কোড> কোনও বিবরণ কখনও কখনও জানাতে পারেন, সঠিক কীওয়ার্ডটি ব্যবহার করে, যথাযথভাবে ট্যাগিং করা, আপনি এখানে যত বেশি সময় নিয়ে আসেন আমি মনে করি, সময়ের সাথে সাথে আমি প্রচুর পোস্টার উন্নত করতে দেখছি। আপনার সম্পাদনা হিসাবে, .trigger()কেবল ইভেন্ট হ্যান্ডলারটিকে অনুরোধ করুন ... আমি নীচে আমার উত্তরে একটি বিবরণ যুক্ত করব।

— নিক ক্র্যাভার

Answer 1

আপনি এটি পড়ার আগে ইভেন্টের এই তালিকাটিকে অন্য পৃষ্ঠায় টানুন, এপিআই নিজেই প্রচুর সহায়ক, এবং আমি নীচে যা আলোচনা করছি তার সবই এই পৃষ্ঠা থেকে সরাসরি লিঙ্ক করা আছে ।

প্রথমত, .click(function)এটি আক্ষরিক জন্য একটি শর্টকাট .bind('click', function), তারা সমান। হ্যান্ডলারকে কোনও উপাদানের সাথে সরাসরি বাঁধার সময় এগুলি ব্যবহার করুন :

$(document).click(function() {
  alert("You clicked somewhere in the page, it bubbled to document");
});

যদি এই উপাদানটি প্রতিস্থাপন করা হয় বা ফেলে দেওয়া হয় তবে এই হ্যান্ডলারটি আর থাকবে না। এছাড়াও হ্যান্ডলার সংযুক্ত করার জন্য এই কোডটি চালানোর সময় যে উপাদানগুলি ছিল না সেগুলি (যেমন নির্বাচক তখন এটি পেয়েছিল) হ্যান্ডলারটি পাবে না।

.live()এবং .delegate()একইভাবে সম্পর্কিত, .delegate()প্রকৃতপক্ষে .live()অভ্যন্তরীণভাবে ব্যবহার করে, তারা উভয়ই বুদবুদ করার জন্য ইভেন্টগুলি শোনেন। এটি নতুন এবং পুরানো উপাদানগুলির জন্য কাজ করে , তারা একইভাবে ইভেন্টগুলিকে বুদবুদ করে। আপনি একজন অভিভাবক / সাধারণ পূর্বপুরুষ যে পেজটি থাকবে এবং যে কোনো স্থানে, ব্যবহার প্রতিস্থাপিত করা যাবে না না থাকে তাহলে যখন আপনার উপাদান, পরিবর্তন হতে পারে যেমন নতুন সারি, তালিকার আইটেম, ইত্যাদি যোগ করুন এটি আপনাকে এগুলি ব্যবহার .live()ভালো:

$(".clickAlert").live('click', function() {
  alert("A click happened");
});

তবে যদি আপনার কোথাও কোনও অভিভাবক উপাদান থাকে যা প্রতিস্থাপিত হচ্ছে না (তাই এর ইভেন্ট হ্যান্ডলাররা বিদায় নিচ্ছেন না) আপনার সাথে এটি পরিচালনা করা উচিত .delegate():

$("#commonParent").delegate('.clickAlert', 'click', function() {
  alert("A click happened, it was captured at #commonParent and this alert ran");
});

এটি প্রায় একইরূপে কাজ করে .live(), তবে ক্যাপচার হওয়ার আগে হ্যান্ডলারের মৃত্যুদণ্ড কার্যকর হওয়ার আগে ইভেন্টটি কয়েকবার বুদবুদ হয়। এগুলির উভয়েরই অন্য একটি সাধারণ ব্যবহার বলা হয় যে কোনও উপাদানটিতে আপনার শ্রেণি পরিবর্তিত হয়, আপনি যে নির্বাচকটির সাথে মূলত ব্যবহার করেছিলেন তার সাথে আর মেলে না ... এই পদ্ধতিগুলির সাথে নির্বাচককে ইভেন্টের সময় মূল্যায়ন করা হয় , যদি এটি মেলে, হ্যান্ডলারটি চালায় .. । সুতরাং উপাদানটি আর নির্বাচকের সাথে মেলে না, এটি আর কার্যকর হবে না। সঙ্গে .click()অবশ্য ইভেন্ট হ্যান্ডলার DOM উপাদান উপর বাউন্ড অধিকার, যে এটি মেলে না যাই হোক না কেন নির্বাচক সেটা খুঁজে পেতে ব্যবহার করা হয়েছিল অপ্রাসঙ্গিক ... ঘটনা আবদ্ধ হয় এবং যতক্ষণ যে উপাদান চলে গেছে এটা স্থিত হচ্ছে, অথবা হ্যান্ডলার মাধ্যমে সরানো হয় .unbind()।

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

---

ট্রিগারিং - আপডেট হওয়া প্রশ্নের জন্য

এখানে 2 টি প্রধান ইভেন্ট-হ্যান্ডলার ট্রিবিং ফাংশন উপলব্ধ রয়েছে, তারা এপিআইতে একই "ইভেন্ট হ্যান্ডলার সংযুক্তি" বিভাগের অধীনে আসে , এগুলি হয় .trigger()এবং .triggerHandler()। .trigger('eventName')সাধারণ ইভেন্টগুলির জন্য কিছু শর্টকাট অন্তর্নির্মিত রয়েছে, উদাহরণস্বরূপ:

$().click(fn); //binds an event handler to the click event
$().click();   //fires all click event handlers for this element, in order bound

আপনি এখানে এই শর্টকাটগুলি সহ একটি তালিকা দেখতে পারেন ।

পার্থক্য হিসাবে, .trigger()ইভেন্ট হ্যান্ডলারটিকে ট্রিগার করে (তবে বেশিরভাগ সময় ডিফল্ট ক্রিয়া হয় না, উদাহরণস্বরূপ কার্সারটিকে একটি ক্লিকের মধ্যে সঠিক জায়গায় স্থাপন করা <textarea>)। এটি ইভেন্ট হ্যান্ডলারগুলিকে ক্রমবদ্ধভাবে আবদ্ধ হওয়ার কারণ ঘটায় (দেশীয় ঘটনাটি হবে), নেটিভ ইভেন্ট ক্রিয়াকলাপগুলিকে আগুন ধরিয়ে দেয় এবং ডোমকে বুদবুদ দেয়।

.triggerHandler()সাধারণত অন্যরকম উদ্দেশ্যে হয়, এখানে আপনি কেবল আবদ্ধ হ্যান্ডলার (গুলি) গুলি চালানোর চেষ্টা করছেন, এটি নেটিভ ইভেন্টগুলিতে আগুন লাগায় না, যেমন একটি ফর্ম জমা দেওয়া। এটি ডোমকে বুদবুদ দেয় না, এবং এটি শৃঙ্খলযোগ্য নয় (এটি ইভেন্টের জন্য শেষ-সীমাবদ্ধ ইভেন্ট হ্যান্ডলার যা-ই ফিরে আসে)। উদাহরণস্বরূপ, যদি আপনি কোনও focusইভেন্টটি ট্রিগার করতে চান তবে বাস্তবে বিষয়টিকে ফোকাস না করতে চান, আপনি কেবল কোডটি .focus(fn)চালানোর জন্য আবদ্ধ করতে চান , এটি এটি করবে, যেখানে .trigger()সেইসাথে উপাদানটি ফোকাস করার পাশাপাশি বুদবুদ আপ হবে।

এখানে একটি বাস্তব বিশ্বের উদাহরণ:

$("form").submit(); //actually calling `.trigger('submit');`

এটি যে কোনও জমা হ্যান্ডলারগুলি চালিত করবে, উদাহরণস্বরূপ jQuery বৈধতা প্লাগইন , তারপরে সাবমিট করার চেষ্টা করুন <form>। তবে যদি আপনি কেবল বৈধ করতে চান, যেহেতু এটি কোনও submitইভেন্ট হ্যান্ডলারের মাধ্যমে আবদ্ধ করা হয়েছে , তবে <form>পরবর্তী সময়ে জমা না দিন , আপনি এটি ব্যবহার করতে পারেন .triggerHandler('submit'):

$("form").triggerHandler('submit');

প্লাগইনটি হ্যান্ডলারটিকে বৈধতা যাচাই পাস না হলে বোমা ফর্ম জমা দেওয়ার থেকে বাধা দেয়, তবে এই পদ্ধতিটি দিয়ে আমরা কী করি তা যত্নশীল করি না। এটিকে বাতিল করা হোক বা না হোক আমরা ফর্মটি জমা দেওয়ার চেষ্টা করছি না , আমরা কেবল এটি পুনরায় বৈধকরণের জন্য ট্রিগার করতে চেয়েছিলাম এবং অন্য কিছু করতে চাইনি। ( অস্বীকৃতি:.validate() প্লাগইনটিতে একটি পদ্ধতি রয়েছে বলে এটি একটি অতিমাত্রার উদাহরণ , তবে এটি অভিপ্রায়টির একটি শালীন উদাহরণ)

Comments

খুব বিস্তারিত. একটি ছোট সংশোধন: triggerএকটি স্থানীয় ঘটনা আগুন দেয় না। নেটিভ বলতে আমার অর্থ একটি ইভেন্ট fireEvent(আইই) বা dispatchEvent(ডাব্লু 3 সি) দিয়ে সিমুলেটেড ।

— ক্রিসেন্ট ফ্রেশ

@ ক্রিসেন্ট - কম অস্পষ্ট হওয়ার জন্য আপডেট হয়েছে, আমি বোঝাতে চাইছি যে এটি ফর্ম জমা দেওয়ার মতো লিঙ্কগুলি অনুসরণ করা ইত্যাদির মতো নেটিভ ইভেন্টের ক্রিয়াকলাপগুলিকে আগুন ধরিয়ে দেয় ... আশা করি আপডেটটি আরও পরিষ্কার হবে :)

— নিক ক্র্যাভার

কি আমি পড়া করছি, এটি আপনার নিতে মত মনে হয় থেকে @Nick উপর live()আপনি আমাকে এখানে দিলেন থেকে আলাদা: stackoverflow.com/questions/3981762/... 'ওজন' এখনো একটি উদ্বেগের বিষয় যখন ব্যবহার করছে live()?

— ইয়াহেল

@ অহেল্যাক - হ্যাঁ, অবশ্যই ... এই উত্তরটি ইভেন্ট হ্যান্ডলারের বিকল্পগুলি এবং তাদের নির্দিষ্ট উদ্দেশ্যে কঠোরভাবে তুলনা করছে। ওজন ব্যয় বনাম প্রারম্ভিক বাইন্ডিংয়ের সংখ্যা বনাম আপনি যদি গতিশীল কিছু বনাম বনাম প্রাথমিক নির্বাচক সমস্ত এখনও বৈধ উদ্বেগ। আপনি হবে যদি পৃষ্ঠার গঠন নয় যে আপনি না বড় যে অনেক ঘটনা তারপর তুমি জরিমানা ... ওজন উদ্বেগ সরাসরি আপনার কাঠামো আকার / গভীরতা এবং ঘটনা সংখ্যার সমানুপাতিক (হয় আপনার .live()কলটি যে ধরণের জন্য শোনায়, যেমন click) উত্পন্ন হচ্ছে, যেহেতু এটি প্রতিটিটির জন্য নির্বাচককে চালায়।

— নিক ক্র্যাভার

jQuery 1.7 এ, লাইভ () $ (ডকুমেন্ট) .on () এর পক্ষে অবচয় করা হয়েছে।

— সিঙ্ক্রো

Answer 2

প্রথম দুটি সমতুল্য।

// The following two statements do the same thing:
$("blah").click( function() { alert( "Click!" ); } );
$("blah").bind( "click", function() { alert( "Click!" ); } ); 

দ্বিতীয়টি যদিও একই সাথে একাধিক ইভেন্টের সাথে আবদ্ধ হতে ব্যবহৃত হতে পারে, বিভিন্ন স্থান-বিচ্ছিন্ন ইভেন্টের নাম উল্লেখ করে:

$("blah").bind( "click mouseover mouseout", function() { alert( "Click! Or maybe mouse moved." ); } ); 

.liveপদ্ধতি আরো আকর্ষণীয়। নিম্নলিখিত উদাহরণ বিবেচনা করুন:

<a class="myLink">A link!</a>
<a id="another">Another link!</a>

<script>
    $("a.myLink").click( function() { alert( 'Click!' ); } );

    $("a#another").addClass( "myLink" );
</script>

স্ক্রিপ্টের দ্বিতীয় লাইনটি কার্যকর হওয়ার পরে, দ্বিতীয় লিঙ্কটিতে "মাইলিঙ্ক" এর একটি সিএসএস ক্লাসও থাকবে। তবে এতে ইভেন্ট হ্যান্ডলারটি থাকবে না, কারণ ইভেন্টটি সংযুক্ত করার সময় এটির ক্লাস ছিল না।

এখন বিবেচনা করুন যে আপনি এটি অন্যভাবে হতে চেয়েছিলেন: প্রতিবার "মাইলিঙ্ক" ক্লাসের সাথে লিঙ্কটি পৃষ্ঠার কোথাও কোথাও উপস্থিত হলে আপনি চান যে এটি স্বয়ংক্রিয়ভাবে একই ইভেন্ট হ্যান্ডলারটি পেতে পারে। এটি খুব সাধারণ যখন আপনার কোনও ধরণের তালিকা বা টেবিল থাকে, যেখানে আপনি সারি বা কক্ষগুলি গতিশীলভাবে যুক্ত করেন তবে সেগুলি সব একইরকম আচরণ করতে চান। ইভেন্ট হ্যান্ডলারদের প্রত্যেকবার নতুন করে নির্ধারণের সমস্ত ব্যথায় যাওয়ার পরিবর্তে আপনি এই .liveপদ্ধতিটি ব্যবহার করতে পারেন :

<a class="myLink">A link!</a>
<a id="another">Another link!</a>

<script>
    $("a.myLink").live( "click", function() { alert( 'Click!' ); } );

    $("a#another").addClass( "myLink" );
</script>

এই উদাহরণে, দ্বিতীয় লিঙ্কটি "মাইলিঙ্ক" শ্রেণিটি পাওয়ার সাথে সাথে ইভেন্ট হ্যান্ডলারটি পেয়ে যাবে। ম্যাজিক! :-)

অবশ্যই এটি আক্ষরিক নয়। .liveহ্যান্ডলারটি যা সত্য তা করে তা হ'ল নির্দিষ্ট উপাদানটির সাথে নয়, তবে এইচটিএমএল ট্রি ("বডি" উপাদান) এর মূলের সাথে। ডিএইচটিএমএলের ইভেন্টগুলিতে "বুদ্বুদ আপ" এর মজার বৈশিষ্ট্য রয়েছে। এই বিবেচনা:

<div> <a> <b>text</b> </a> </div>

আপনি যদি "পাঠ্য" এ ক্লিক করেন তবে প্রথমে <b> উপাদানটি একটি "ক্লিক" ইভেন্ট পাবে। এর পরে, <a> উপাদানটি একটি "ক্লিক" ইভেন্ট পাবে। এবং এর পরে <ডিভি> উপাদানটি একটি "ক্লিক" ইভেন্ট পাবে। এবং এইভাবে - সমস্ত উপায় <body> উপাদান পর্যন্ত। এবং সেই জায়গাতেই jQuery ইভেন্টটি ধরবে এবং দেখবে যে কোনও "লাইভ" হ্যান্ডলার রয়েছে যা উপাদানটির জন্য প্রয়োগ করে যা প্রথম স্থানে ইভেন্টটি ঘটায়। ঝরঝরে!

এবং অবশেষে, .delegateপদ্ধতি। এটি কেবলমাত্র আপনার উপাদানটির সমস্ত শিশুদের নেয় যা প্রদত্ত নির্বাচিতের সাথে সামঞ্জস্য হয় এবং তাদের সাথে একটি "লাইভ" হ্যান্ডলার সংযুক্ত করে। দেখা যাক:

$("table").delegate( "td", "click", function() { alert( "Click!" ); } );

// Is equivalent to:
$("table").each( function() {
    $(this).find( "td" ).live( "click", function() { alert( "Click!" ); } );
} );

প্রশ্ন?

Comments

সঠিক হতে, .live()থেকে সহিত আবদ্ধ documentনা <body>: :) আপনি একটি ডেমো এখানে দেখতে পারেন, শুধু আপ কনসোল পরিদর্শন টান jsfiddle.net/aJy2B

— নিক Craver

এটি এভাবে ব্যাখ্যা করা আরও সুবিধাজনক ছিল। :-)

— ফায়োডর সাইকিন

"দেহ" অংশে যথেষ্ট ন্যায্য, তবে "সমস্ত উপায়ে <body> উপাদান" অবধি ভুল, ঘটনাগুলি সেখানে অতীতকে ঘিরেই অবিরত করে চলেছে, এবং .live()হ্যান্ডলাররা যেখানে বাস করেন না, এটি তারও উপরে, document:) আপনি দেখতে পাচ্ছেন এর ডেমো এখানে: jsfiddle.net/S2VBX

— নিক ক্র্যাভার

Answer 3

JQuery 1.7 হিসাবে, .live () পদ্ধতি অবমূল্যায়ন করা হয়েছিল। আপনি যদি jQuery সংস্করণ <1.7 এর তুলনায় আনুষ্ঠানিকভাবে .delegate () ওভার লাইভ () ব্যবহার করার পরামর্শ দেওয়া হয় তার চেয়ে বেশি ব্যবহার করছেন।

.live () এখন .on () দিয়ে প্রতিস্থাপন করা হয়েছে।

আরও তথ্যের জন্য সরাসরি jQuery সাইটে যেতে সেরা, তবে এখানে .on () পদ্ধতির বর্তমান সংস্করণগুলি রয়েছে:

.on( events [, selector] [, data], handler(eventObject) )
.on( events-map [, selector] [, data] )

http://api.jquery.com/on/

Answer 4

$().click(fn)এবং $().bind('click', fn)প্রথম দর্শনে অভিন্ন, তবে $.bindসংস্করণ দুটি কারণে আরও শক্তিশালী:

1. $().bind()আপনাকে একাধিক ইভেন্টে একটি হ্যান্ডলার বরাদ্দ করতে দেয়, উদাহরণস্বরূপ $().bind('click keyup', fn),।
2. $().bind()নেমস্পিড ইভেন্টগুলিকে সমর্থন করে - আপনি যদি এমন কিছু ইভেন্ট হ্যান্ডলার সরিয়ে নিতে চান (শক্তিশালীকরণ) তবে একটি শক্তিশালী বৈশিষ্ট্য যা নেমস্পিড ইভেন্টগুলিতে আরও পড়ুন ।

লাইভ বনাম প্রতিনিধি: এটি ইতিমধ্যে অন্যান্য উত্তরে উত্তর দেওয়া হয়েছে।

Answer 5

এটিই এপিআই পড়তে সাহায্য করতে পারে। যাইহোক, আমি আমার মাথার উপরের অংশটি জানি, যাতে আপনি অলসতা চালিয়ে যেতে পারেন (ইয়ে!)

$('#something').click(fn);
$('#something').bind('click',fn);

এখানে কোনও পার্থক্য নেই (যা আমি জানি)। .clickকেবল একটি সুবিধা / সহায়ক পদ্ধতি method.bind('click'

// even after this is called, all <a>s in
// <div class="dynamic_els"> will continue
// to be assigned these event handlers

$('div.dynamic_els a').live(‘click’,fn);

এটি খুব আলাদা, যেমন .liveআপনি নির্বাচিতদের পাস করে এমন ইভেন্টগুলিকে যুক্ত করে (যা আপনি এখানে করেননি) এবং নোডগুলি সন্নিবেশ / সরানো হওয়ায় DOM এর দিকে তাকাতে থাকে

$('#some_element').delegate('td','click',fn);

আপনি ইভেন্ট হ্যান্ডলারদের যেভাবে নিয়োগ করছেন তা এটির চেয়ে আলাদা only .delegateDOM ইভেন্ট বুদবুদ কেন্দ্রিক হয়। মৌলিক নীতি যে ঘটনা DOM গাছ মাধ্যমে উর্ধ্বগামী বুদবুদ যে পর্যন্ত এটি মূল উপাদান ছুঁয়েছে (হয় documentবা windowবা <html>বা <body>, আমি ঠিক মনে করতে পারছি না)।

উভয় ক্ষেত্রেই, আপনি একটি বাঁধাই করছি onclickএকটি সবাইকে হ্যান্ডলার <td>মধ্যে গুলি $('#some_element')(যদিও আপনি বলতে পারে আপনি একটি নির্বাচক উল্লেখ করতে হবে $(document))। যখন এর কোনও শিশুকে ক্লিক করা হয়, ইভেন্টটি বুদবুদ হয়ে থাকে <td>। তারপরে আপনি ইভেন্টটির উত্স উপাদানটি বের করতে পারেন (যা jQuery স্বয়ংক্রিয়ভাবে আপনার জন্য করে)।

এটি কার্যকর হয় যখন প্রচুর পরিমাণে উপাদান থাকে এবং আপনার কেবলমাত্র কয়েকটি (বা একটি কেন্দ্রীয়) পয়েন্ট [গুলি] থাকে যেগুলি এই ইভেন্টগুলি দিয়ে যাবে। এই ইভেন্ট হ্যান্ডলারগুলিকে কম বস্তুতে একীভূত করার জন্য এটি ব্রাউজারের প্রচেষ্টা এবং মেমরিটিকে বাঁচায়।

Comments

.live() এছাড়াও ঘটনা সাড়া জাগানো বন্ধ কাজ করে, আসলে .delegate()একটি মোড়কের হয় .live(), এটা ঠিক একটি প্রেক্ষাপটে যুক্ত করা এবং একটি উপাদানে বাঁধাই হচ্ছে অন্যান্য তুলনায় documentবুদবুদ ক্যাপচার। আমি মনে করি বুদবুদ হ্যান্ডলাররা কীভাবে কাজ করে সে সম্পর্কে আপনার বোঝাপড়াটি কিছুটা বন্ধ (আমি মনে করি এটি jQuery 1.4 এর সর্বাধিক ভুল বোঝাবুঝি দিক)। হ্যান্ডলারটি কেবলমাত্র আপনাকে আবদ্ধ করার উপাদানটিতে রয়েছে, তাই আপনি যেই উপাদানটি কল করেছিলেন .delegate()বা documentতার ক্ষেত্রে .live()যখন কোনও ইভেন্ট বুদবুদ হয়, এটি নির্বাচকটির সাথে মেলে কিনা তা লক্ষ্যমাত্রা পরীক্ষা করে এবং যদি তা কার্যকর করে।

— নিক ক্র্যাভার