আমি সম্প্রতি ইভেন্টগুলির সাথে কাজ করছি এবং একটি পৃষ্ঠায় সমস্ত ইভেন্ট দেখতে / নিয়ন্ত্রণ করতে চেয়েছিলাম। সম্ভাব্য সমাধানগুলি দেখার পরে, আমি সিদ্ধান্ত নিয়েছি যে আমি নিজের পথে চলেছি এবং ইভেন্টগুলি পর্যবেক্ষণ করার জন্য একটি কাস্টম সিস্টেম তৈরি করব। সুতরাং, আমি তিনটি জিনিস করেছি।
প্রথমত, পৃষ্ঠাতে সমস্ত ইভেন্ট শ্রোতার জন্য আমার একটি ধারক প্রয়োজন: এটি EventListenersহ'ল অবজেক্ট। এটি তিনটি দরকারী পদ্ধতি আছে: add(), remove(), এবং get()।
এর পরে, আমি একজন নির্মিত EventListenerবস্তু ইভেন্টের জন্য প্রয়োজনীয় তথ্য রাখা, অর্থাত্: target, type, callback, options, useCapture, wantsUntrusted, এবং একটি পদ্ধতি যোগremove() শ্রোতা মুছে ফেলার জন্য।
শেষ অবধি, আমি তাদের তৈরি ( এবং ) যে জিনিসগুলি তৈরি করেছি তার সাথে তাদের কাজ করার জন্য দেশীয় addEventListener()এবং removeEventListener()পদ্ধতিগুলি প্রসারিত করেছি ।EventListenerEventListeners
ব্যবহার:
var bodyClickEvent = document.body.addEventListener("click", function () {
console.log("body click");
});
// bodyClickEvent.remove();
addEventListener()একটি EventListenerঅবজেক্ট তৈরি করে , এতে যুক্ত করে EventListenersএবং ফেরত দেয়EventListener বস্তুকে , তাই এটি পরে মুছে ফেলা যায়।
EventListeners.get()পৃষ্ঠায় শ্রোতাদের দেখতে ব্যবহার করা যেতে পারে। এটি একটি EventTargetবা একটি স্ট্রিং গ্রহণ করে (ইভেন্টের ধরণ)।
// EventListeners.get(document.body);
// EventListeners.get("click");
ডেমো
আসুন আমরা এই বর্তমান পৃষ্ঠায় প্রতিটি ইভেন্ট শ্রোতা জানতে চান বলে যাক। আমরা এটি করতে পারি (ধরে নিই যে আপনি এই ক্ষেত্রে স্ক্রিপ্ট ম্যানেজার এক্সটেনশন ব্যবহার করছেন, ট্যাম্পারমনকি)। নিম্নলিখিত লিপিটি এটি করে:
// ==UserScript==
// @name New Userscript
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author You
// @include https://stackoverflow.com/*
// @grant none
// ==/UserScript==
(function() {
fetch("https://raw.githubusercontent.com/akinuri/js-lib/master/EventListener.js")
.then(function (response) {
return response.text();
})
.then(function (text) {
eval(text);
window.EventListeners = EventListeners;
});
})(window);
এবং যখন আমরা সমস্ত শ্রোতাদের তালিকাবদ্ধ করি তখন এটি বলছে 299 ইভেন্ট শ্রোতা রয়েছে। কিছু সদৃশ আছে বলে মনে হয় ", তবে সেগুলি সত্যই নকল কিনা তা আমি জানি না। প্রতিটি ইভেন্টের ধরণটি নকল হয় না, সুতরাং এই সমস্ত "নকল" ব্যক্তিগত শ্রোতা হতে পারে।
কোডটি আমার সন্ধানাগারে পাওয়া যাবে । আমি এটি এখানে পোস্ট করতে চাইনি কারণ এটি দীর্ঘ।
আপডেট: এটি jQuery এর সাথে কাজ করবে বলে মনে হচ্ছে না। যখন আমি ইভেন্টলিস্টনার পরীক্ষা করি তখন আমি দেখতে পাই যে কলব্যাকটি রয়েছে
function(b){return"undefined"!=typeof r&&r.event.triggered!==b.type?r.event.dispatch.apply(a,arguments):void 0}
আমি বিশ্বাস করি এটি jQuery এর অন্তর্গত, এবং এটি আসল কলব্যাক নয়। jQuery ইভেন্ট ইভেন্টের বৈশিষ্ট্যগুলিতে প্রকৃত কলব্যাক সংরক্ষণ করে:
$(document.body).click(function () {
console.log("jquery click");
});
ইভেন্ট শ্রোতাদের সরানোর জন্য, আসল কলব্যাকটি removeEventListener()পদ্ধতিতে পাস করা দরকার । সুতরাং jQuery দিয়ে এই কাজটি করার জন্য এটির আরও পরিবর্তন প্রয়োজন। আমি ভবিষ্যতে এটি ঠিক করতে পারে।
