জাভাস্ক্রিপ্ট এর অ্যাডএভেন্টলিস্টনার পদ্ধতির jQuery সমতুল্য


190

আমি এই জাভাস্ক্রিপ্ট পদ্ধতি কলের jQuery সমতুল্য সন্ধান করার চেষ্টা করছি:

document.addEventListener('click', select_element, true);

আমি যতদূর পেরেছি:

$(document).click(select_element);

তবে জাভাস্ক্রিপ্ট পদ্ধতির শেষ প্যারামিটার হিসাবে এটি একই ফলাফল অর্জন করতে পারে না - এমন একটি বুলিয়ান যা নির্দেশ করে যে ইভেন্ট হ্যান্ডলারটি ক্যাপচারিং বা বুদবুদ পর্যায়ে কার্যকর করা উচিত কিনা ( http://www.quirksmode.org থেকে আমার বোঝা অনুসারে ) /js/events_advanced.html ) - বাদ পড়েছে।

আমি কীভাবে সেই প্যারামিটারটি নির্দিষ্ট করব বা অন্যথায় jQuery ব্যবহার করে একই কার্যকারিতা অর্জন করব?


3
ইভেন্ট ক্যাপচারিং jQuery দ্বারা সমর্থিত নয়, যেমন ইভেন্ট ক্যাপচারিং IE দ্বারা সমর্থিত নয়, যা jQuery সমর্থন করে;) আপনি কী আইপি সামঞ্জস্যতা খুঁজছেন?
ক্রিসেন্ট ফ্রেশ

ধন্যবাদ, ক্রিসেন্ট ফ্রেশ - আমি মনে করি এটি এখন বোধগম্য। আমার কাছে IE সামঞ্জস্যতা দরকার তাই আমি মনে করি ক্যাপচারিং পর্বটি সম্পর্কে আমার ভুলে যাওয়া উচিত।
বুংগল

উত্তর:


142

সমস্ত ব্রাউজারগুলি ইভেন্ট ক্যাপচারিংকে সমর্থন করে না (উদাহরণস্বরূপ, ইন্টারনেট এক্সপ্লোরার সংস্করণ 9 টিরও কম নয়) তবে সকলেই ইভেন্ট বুদবুদিকে সমর্থন করে, এ কারণেই এটি ক্রস-ব্রাউজারের সমস্ত অ্যাবস্ট্রাকশনের ইভেন্টগুলিতে হ্যান্ডলারদের আবদ্ধ করার জন্য ব্যবহৃত পর্ব, jQuery এর অন্তর্ভুক্ত।

আপনি jQuery এ যা সন্ধান করছেন তার নিকটতম ব্যবহার করছে bind()( on()jQuery 1.7+ দ্বারা উত্সাহিত) বা ইভেন্ট-নির্দিষ্ট jQuery পদ্ধতিগুলি (এই ক্ষেত্রে click(), যা bind()অভ্যন্তরীণভাবে কল করে )। সমস্ত উত্থাপিত ইভেন্টের বুদবুদ পর্বটি ব্যবহার করে।


6
দেখে মনে হচ্ছে IE9 শেষ পর্যন্ত এটি সমর্থন করে। ব্লগস.এমএসডন.কম
কিছু

এবং কেন তারা ইভেন্ট ক্যাপচার সমর্থন করে না? ইভেন্ট ক্যাপচারিং এর ডাউনসাইডস কি?
আকাশ

2
কেবল পরিষ্কার করার জন্য, আপনি বলছেন যে ওপি যা চায় তা সম্ভব নয় - আপনাকে বুদবুদ ব্যবহার করতে হবে, এবং ক্যাপচারিং ব্যবহার করতে পারবেন না। রাইট?
নুমেনন

115

JQuery 1.7 হিসাবে, .on()এখন ইভেন্টগুলি আবদ্ধ করার পরিবর্তে পছন্দের পদ্ধতি .bind():

Http://api.jquery.com/bind/ থেকে :

JQuery 1.7 হিসাবে, .on () পদ্ধতিটি কোনও নথিতে ইভেন্ট হ্যান্ডলার সংযুক্ত করার জন্য পছন্দসই পদ্ধতি। পূর্ববর্তী সংস্করণগুলির জন্য .bind () পদ্ধতিটি কোনও ইভেন্ট হ্যান্ডলার সরাসরি উপাদানগুলিতে সংযুক্ত করার জন্য ব্যবহৃত হয়। হ্যান্ডলারগুলি বর্তমানে নির্বাচিত উপাদানগুলির সাথে জিকুয়েরি অবজেক্টে সংযুক্ত রয়েছে, সুতরাং .bind () এ কল হওয়ার পরে সেই উপাদানগুলি উপস্থিত থাকতে হবে। আরও নমনীয় ইভেন্ট বাইন্ডিংয়ের জন্য .on () বা .delegate () এ ইভেন্ট প্রতিনিধি দলের আলোচনা দেখুন।

ডকুমেন্টেশন পৃষ্ঠাটি http://api.jquery.com/on/ এ অবস্থিত


এটি সম্বোধনের জন্য গৃহীত উত্তর সম্পাদনা করা হয়েছে।
যে ব্যবহারকারী


14

নোটটিতে একটা জিনিষ যে jQuery ঘটনা পদ্ধতি ফায়ার / ফাঁদ না loadউপর embedট্যাগ যে করা SVG করে DOM যা একটি পৃথক নথিতে যেমন লোড ধারণ embedট্যাগ। এগুলিতে আমি কোনও loadইভেন্ট ফাঁদে পাবার একমাত্র উপায় হ'ল কাঁচা জাভাস্ক্রিপ্ট ব্যবহার করা।

এটি কাজ করবে না (আমি চেষ্টা করেছি on/ bind/ loadপদ্ধতিগুলি):

$img.on('load', function () {
    console.log('FOO!');
});

তবে, এটি কাজ করে:

$img[0].addEventListener('load', function () {
    console.log('FOO!');
}, false);

1
আপনি যদি উপাদান (গুলি) এর জন্য অন্য কোনও সীমাবদ্ধ ইভেন্ট হ্যান্ডলারের উপরে ওভাররাইট না করার ইচ্ছা রাখেন তবে এটি সঠিক উপায় হিসাবে লক্ষ করা উচিত।
r3wt

কি $img?
আনাতল

12

.on()ইভেন্টগুলি আবদ্ধ করতে আপনার এখন ফাংশনটি ব্যবহার করা উচিত ।



1

মানক জাভাস্ক্রিপ্টের জন্য এই ইস্যুটির মোজিলা বিকাশ নেটওয়ার্কের (এমডিএন) একটি চমত্কার চিকিত্সা এখানে দেওয়া হয়েছে (আপনি যদি jQuery এর উপর নির্ভর করতে বা সাধারণভাবে এটি আরও ভালভাবে বুঝতে না চান):

https://developer.mozilla.org/en-US/docs/DOM/element.addEventListener

উপরের চিকিত্সার একটি লিঙ্ক থেকে ইভেন্ট প্রবাহের আলোচনা এখানে রয়েছে:

http://www.w3.org/TR/DOM-Level-3-Events/#event-flow

কয়েকটি মূল বিষয় হ'ল:

  • এটি কোনও ইভেন্টের জন্য একক হ্যান্ডলারের চেয়ে বেশি যোগ করার অনুমতি দেয়
  • শ্রোতা সক্রিয় হয়ে গেলে এটি আপনাকে পর্বের সূক্ষ্ম-নিয়ন্ত্রণযুক্ত নিয়ন্ত্রণ দেয় (বনাম বুদবুদ ক্যাপচার)
  • এটি কোনও এইচএমএল উপাদান নয়, কোনও ডিওএম উপাদান নিয়ে কাজ করে
  • ইভেন্টটিতে পাস করা "এই "টির মান বৈশ্বিক অবজেক্ট (উইন্ডো) নয়, যে উপাদান থেকে উপাদানটিকে বহিস্কার করা হয়। এটি খুব সুবিধাজনক।
  • লিগ্যাসি আইই ব্রাউজারগুলির জন্য কোডটি সহজ এবং "লিগ্যাসি ইন্টারনেট এক্সপ্লোরার এবং সংযুক্তি" শীর্ষক অন্তর্ভুক্ত included
  • আপনি কোনও বেনামি কার্যক্রমে হ্যান্ডলারটি বন্ধ করে রাখলে আপনি প্যারামিটারগুলি অন্তর্ভুক্ত করতে পারেন
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.