jQuery ইভেন্ট হ্যান্ডলার একটি বস্তুর সাথে নিবন্ধিত সন্ধান করুন

Question

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

উদাহরণ স্বরূপ:

$("#el").click(function() {...});
$("#el").mouseover(function() {...});

$("#el")করেছে ক্লিক এবং মাউসওভার নিবন্ধিত।

এটি খুঁজে বের করার কোনও ফাংশন রয়েছে এবং সম্ভবত ইভেন্ট হ্যান্ডলারের মাধ্যমে পুনরাবৃত্তি হতে পারে?

যদি যথাযথ পদ্ধতির মাধ্যমে কোনও jQuery অবজেক্টে এটি সম্ভব না হয় তবে এটি কি সরল DOM অবজেক্টে সম্ভব?

Comments

দুর্ভাগ্যক্রমে, এখন: bugs.jquery.com/ticket/10589

— Skylar Saveland

jQuery প্রাক এবং পোস্ট 1.8 উভয় সমর্থন করুন:var events = (jQuery._data || jQuery.data)(elem, 'events');

— অরিয়াদাম

মনে রাখবেন যে এই ইভেন্ট শ্রোতাদের দেখতে আপনি এফএফ এবং ক্রোম দেব-সরঞ্জামগুলি (এফ 12) ব্যবহার করতে পারেন। দেখুন developers.google.com/web/tools/chrome-devtools/debug/... এবং developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/...

— oriadam

Answer 1

JQuery 1.8 হিসাবে, ইভেন্টের ডেটা "পাবলিক এপিআই" থেকে আর পাওয়া যায় না। এই jQuery ব্লগ পোস্ট পড়ুন । পরিবর্তে আপনার এখন এটি ব্যবহার করা উচিত:

jQuery._data( elem, "events" );

elem এইচটিএমএল এলিমেন্ট হওয়া উচিত, কোনও jQuery অবজেক্ট বা নির্বাচক নয়।

দয়া করে মনে রাখবেন, এটি একটি অভ্যন্তরীণ, 'ব্যক্তিগত' কাঠামো, এবং এটি পরিবর্তন করা উচিত নয়। এটি কেবল ডিবাগিংয়ের উদ্দেশ্যেই ব্যবহার করুন।

JQuery এর পুরানো সংস্করণগুলিতে আপনাকে পুরানো পদ্ধতিটি ব্যবহার করতে হতে পারে যা হ'ল:

jQuery( elem ).data( "events" );

Comments

তবে আপনি এখনও ব্যবহার করতে পারেন $._data($(elem).get(0), "events")

— বুলগেরে

blog.jquery.com/2011/11/08/building-a-slimmer-jquery .data ("ইভেন্ট"): jQuery প্রতিটি ইভেন্টের ইভেন্টগুলির নাম (এটির জন্য অপেক্ষা করুন) নামের একটি ডেটা অবজেক্টে তার ইভেন্ট সম্পর্কিত ডেটা সংরক্ষণ করে। এটি একটি অভ্যন্তরীণ ডেটা কাঠামো তাই ১.৮ এ এটি ব্যবহারকারীর ডেটা নাম স্থান থেকে সরানো হবে যাতে এটি একই নামের আইটেমগুলির সাথে বিরোধ না করে won't jQuery এর ইভেন্টের ডেটা এখনও jQuery._data (উপাদান, "ইভেন্ট") এর মাধ্যমে অ্যাক্সেস করা যেতে পারে তবে সচেতন থাকুন যে এটি একটি অভ্যন্তরীণ ডেটা কাঠামো যা অনিবন্ধিত এবং এটি পরিবর্তন করা উচিত নয়।

— স্যাম গ্রিনহালগ

আমি এই পদ্ধতিটি ব্যবহার করে একটি বোতামের ক্লিক ইভেন্টটি চেষ্টা করে দেখতে চেষ্টা করেছি। ক্রোম কনসোলে এটি handler: function () {ক্লিক করে সম্পত্তিটির ভিতরে প্রদর্শিত হয়েছিল। ফাংশনের সম্পূর্ণ বিষয়বস্তু প্রসারিত করতে এবং প্রদর্শন করতে আমাকে ফাংশন অংশে ডাবল ক্লিক করতে হয়েছিল।

— জিম

@ জিম ইয়াহা, ডাবল ক্লিকটি উত্তর

— আদিব

var events = (jQuery._data || jQuery.data)(elem, 'events');

— নির্বিঘ্নে

Answer 2

আপনি ইভেন্টগুলি (jQuery 1.8+ হিসাবে) এর ক্রল করে এটি করতে পারেন:

$.each($._data($("#id")[0], "events"), function(i, event) {
  // i is the event type, like "click"
  $.each(event, function(j, h) {
    // h.handler is the function being called
  });
});

আপনি এখানে খেলতে পারেন এমন একটি উদাহরণ এখানে:

$(function() {
  $("#el").click(function(){ alert("click"); });
  $("#el").mouseover(function(){ alert("mouseover"); });

  $.each($._data($("#el")[0], "events"), function(i, event) {
    output(i);
    $.each(event, function(j, h) {
        output("- " + h.handler);
    });
  });
});

function output(text) {
    $("#output").html(function(i, h) {
        return h + text + "<br />";
    });
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="el">Test</div>
<code>
    <span id="output"></span>
</code>

Comments

এটা সঠিক উত্তর. গুরুত্বপূর্ণ বিট দ্বিতীয়ার্ধ। এটি আমাকে এক মিনিটের মধ্যে এমন সমস্যা খুঁজে পেতে সহায়তা করেছে যা আমাকে সমস্ত কোডের মাধ্যমে অনুসন্ধান করতে হলে এক ঘন্টা সময় নিতে পারত। ধন্যবাদ!

— অ্যান্ড্রু এনসলে

1.4 দিয়ে কাজ করে তবে jQuery 1.8.2 এ নয়।

— টিমো Kähkönen

JQuery এর 1.8+ জন্য, আপনি আবশ্যক : 'ব্যক্তিগত ডেটাতে' পদ্ধতি ব্যবহার jQuery._data( jQuery("#el")[0], "events" );'পাবলিক ডেটা' পদ্ধতির পরিবর্তে: jQuery("#el").data("events")। eventsবস্তু আসলে সঞ্চিত করা হয়েছে .data()একটি দীর্ঘ সময়ের জন্য, আমরা কোড কয়েক বাইট আউট "পাবলিক এপিআই" থেকে এই "প্রক্সি নয়" সরিয়ে ছাঁটা

— gnarf

Answer 3

JQuery 1.8+ এর জন্য, এটি আর কাজ করবে না কারণ অভ্যন্তরীণ ডেটা একটি ভিন্ন অবজেক্টে স্থাপন করা হয়েছে।

সর্বশেষ আনুষ্ঠানিক (তবে পূর্ববর্তী সংস্করণগুলিতেও কাজ করে, কমপক্ষে 1.7.2 এ) এটি করার পদ্ধতিটি হ'ল - $._data(element, "events")

আন্ডারস্কোর ("_") এখানে পার্থক্য তৈরি করে। অভ্যন্তরীণভাবে, এটি কল করছে $.data(element, name, null, true), শেষ (চতুর্থ) পরামিতিটি একটি অভ্যন্তরীণ ("প্রাইভেট")।

Comments

$ ._ ডেটা ("বডি", "ইভেন্ট") অপরিজ্ঞাত $ ()। jquery; "1.7.1" (1.7.2 এবং 1.8.1 সর্বদা "অপরিজ্ঞাত" চেষ্টা করেছেন)

— মার্স রবার্টসন

@ মিচাল - api.jquery.com/jQuery.data বলছে এটি কোনও উপাদানকে গ্রহণ করে, নির্বাচককে নয়।

— ফিস্টুক

এখন সূক্ষ্মভাবে কাজ করে: $ ._ ডেটা ($ ("বডি") get

— মার্স রবার্টসন

এফডব্লিউআইডাব্লু - এটি নির্দেশ করে যে এটি 'অভ্যন্তরীণভাবে' একটি প্যারামিটার সহ অন্যান্য ডেটা ফাংশনকে কল করে যা আমরা বিশেষভাবে নথি করি না সম্ভবত প্রয়োজন হয় না। তবে হ্যাঁ, jQuery._data( element, "events" )এখন এই তথ্যটি পাওয়ার 'সঠিক' উপায়।

— gnarf

Answer 4

নির্লজ্জ প্লাগ, তবে আপনি FindHandlerJS ব্যবহার করতে পারেন

এটি ব্যবহার করার জন্য আপনাকে সন্ধানের জন্য হ্যান্ডলারের জেএস অন্তর্ভুক্ত করতে হবে (বা কেবল ক্রোমের কনসোল উইন্ডোতে কাঁচা জাভাস্ক্রিপ্ট কোডটি অনুলিপি করুন এবং পেস্ট করুন ) এবং আপনার আগ্রহী উপাদানগুলির জন্য ইভেন্টের ধরণ এবং একটি জেকারি নির্বাচনকারী নির্দিষ্ট করতে হবে।

আপনার উদাহরণস্বরূপ আপনি তাড়াতাড়ি করে ইভেন্টটির হ্যান্ডলারগুলি খুঁজে পেয়েছিলেন doing

findEventHandlers("click", "#el")
findEventHandlers("mouseover", "#el")

এটিই ফিরে আসে:

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

আপনি এটি এখানে চেষ্টা করতে পারেন

Comments

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

— মারকুইনহো পেলি

Answer 5

এই উদ্দেশ্যে আমি ফায়ারব্যাগে ইভেন্টব্যাগ প্লাগইন ব্যবহার করি ।

Comments

ধন্যবাদ, দুর্দান্ত টিপ এক্সটেনশনটি ফায়ারব্যাগে ("ইভেন্টস") একটি ট্যাব যুক্ত করে যা পৃষ্ঠার ইভেন্টগুলি দেখায়, যাতে আপনি এগুলিকে সহজেই এক্সপোর করতে পারেন।

— গ্রুবার

এছাড়াও, ক্রোম বিকাশকারী সরঞ্জামগুলির "উপাদানগুলি" ট্যাবটির নীচে "ইভেন্ট শ্রোতা" এবং "উত্স" ট্যাবের অধীনে "ইভেন্ট শ্রোতার ব্রেকপয়েন্টস" রয়েছে।

— क्লেটিজার্মেকে 1

Answer 6

আমি উভয় সমাধান @ জেপিএস থেকে একটি ফাংশনে একত্রিত করেছি:

jQuery.fn.getEvents = function() {
    if (typeof(jQuery._data) === 'function') {
        return jQuery._data(this.get(0), 'events') || {};
    }

    // jQuery version < 1.7.?
    if (typeof(this.data) === 'function') {
        return this.data('events') || {};
    }

    return {};
};

তবে সাবধান থাকুন, এই ফাংশনটি কেবল এমন ইভেন্টগুলিকেই ফিরিয়ে দিতে পারে যা নিজেই jQuery ব্যবহার করে সেট করা হয়েছিল।

Answer 7

১.৯ হিসাবে পুরানো আচরণ পুনরুদ্ধার করতে মাইগ্রেট প্লাগইন ব্যবহার করা ছাড়া ইভেন্টগুলি পুনরুদ্ধার করার জন্য কোনও নথিভুক্ত উপায় নেই। আপনি _.ডাটা () পদ্ধতিটি jps এর উল্লেখ হিসাবে ব্যবহার করতে পারেন তবে এটি একটি অভ্যন্তরীণ পদ্ধতি। সুতরাং সঠিক কাজটি করুন এবং আপনার এই কার্যকারিতাটির প্রয়োজন হলে মাইগ্রেট প্লাগইনটি ব্যবহার করুন।

চালু jQuery ডকুমেন্টেশন থেকে .data("events")

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

Comments

গৃহীত উত্তরটি সাম্প্রতিক সংস্করণগুলির জন্য এটি পাওয়ার নতুন এবং সঠিক উপায়টিও পরিষ্কারভাবে দেখায় : jQuery._data( elem, "events" );...

— ইয়ান

একটি ব্যক্তিগত, অনাবন্ধিত উপায় কখনই সঠিক উপায় হতে পারে না । সঠিক উপায় - অর্থ নথিভুক্ত, সর্বজনীন এবং উদ্দেশ্যে - হ'ল মাইগ্রেট প্লাগইন ব্যবহার করা।

— অলিগোফ্রেন

আপনি স্থানান্তর প্লাগইনটির পয়েন্টটি ভুল বুঝেছেন বলে মনে হচ্ছে। jQuery হ্রাস করা বৈশিষ্ট্যগুলি সরানো হয়েছে এবং মাইগ্রেট প্লাগইনটি হ'ল বিকাশকারীদের কোডটিকে নতুন সংস্করণগুলিতে মাইগ্রেট করতে সহায়তা করা যাতে তারা তাত্ক্ষণিকভাবে নতুন বৈশিষ্ট্য এবং উন্নতির সুযোগ নিতে পারে তবে কার্যকারিতা হারাতে পারে না। এটি কোডারকে jQuery এর নতুন সংস্করণগুলি সঠিকভাবে ব্যবহার শুরু করার জন্য তাদের কী করা দরকার তা বোঝাতে সহায়তা করা। বৈশিষ্ট্য পুনরুদ্ধার করতে আপনার এটি উত্পাদন করা উচিত নয় । এছাড়াও, jQuery ডকুমেন্টেশনে অনেক কিছুই নথিভুক্ত করা হয় না এবং তা আপ টু ডেট হয় না - তারা এর আগে এটি উল্লেখ করেছে, সুতরাং এটি কোনও কারণ নয়

— আয়ান

এছাড়াও, যদি এটি jQuery ব্লগের পরামর্শ হিসাবে অন্তর্ভুক্ত করা হয় তবে আমি এটি ব্যবহার করব: blog.jquery.com/2012/08/09/jquery-1-8- রিলিজ

— ইয়ান

মাইগ্রেট প্লাগইনে আপনার যুক্তি যুক্তিসঙ্গত বলে মনে হচ্ছে। ঠিক আছে আমি যদি আমার উত্তর মুছে ফেলি?

— ওলিগোফ্রেন

Answer 8

কোনও উপাদানটিতে ইভেন্টগুলি পরীক্ষা করতে:

var events = $._data(element, "events")

মনে রাখবেন যে এটি কেবল সরাসরি ইভেন্ট হ্যান্ডলারের সাথে কাজ করবে, আপনি যদি $ (দস্তাবেজ) .on ("ইভেন্ট-নাম", "জকিউ-নির্বাচক", ফাংশন () {// লজিক}) ব্যবহার করেন তবে আপনি এটি দেখতে চাইবেন getEvents এই উত্তরের নীচে ফাংশন

উদাহরণ স্বরূপ:

 var events = $._data(document.getElementById("myElemId"), "events")

অথবা

 var events = $._data($("#myElemId")[0], "events")

সম্পূর্ণ উদাহরণ:

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
        <script>
            $(function() {
                $("#textDiv").click(function() {
                    //Event Handling
                });
                var events = $._data(document.getElementById('textDiv'), "events");
                var hasEvents = (events != null);
            });
        </script>
    </head>
    <body>
        <div id="textDiv">Text</div>
    </body>
</html>

Check (ডকুমেন্ট) সাথে ইনস্টল করা গতিশীল শ্রোতাদের অন্তর্ভুক্ত চেক করার আরও একটি সম্পূর্ণ উপায়

function getEvents(element) {
    var elemEvents = $._data(element, "events");
    var allDocEvnts = $._data(document, "events");
    for(var evntType in allDocEvnts) {
        if(allDocEvnts.hasOwnProperty(evntType)) {
            var evts = allDocEvnts[evntType];
            for(var i = 0; i < evts.length; i++) {
                if($(element).is(evts[i].selector)) {
                    if(elemEvents == null) {
                        elemEvents = {};
                    }
                    if(!elemEvents.hasOwnProperty(evntType)) {
                        elemEvents[evntType] = [];
                    }
                    elemEvents[evntType].push(evts[i]);
                }
            }
        }
    }
    return elemEvents;
}

ব্যবহারের উদাহরণ:

getEvents($('#myElemId')[0])

Comments

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

— ডোমিনিক সিজাইমস্কি

ওহ, টম, এটি আসলে আপনার কোড যা এই পদ্ধতির প্রতিটি প্রয়োগের সাথে ইভেন্টগুলি গুণ করে। ভাল না.

— ডোমিনিক সিজাইমস্কি

Answer 9

আমি একটি কাস্টম jQuery নির্বাচনকারী তৈরি করেছি যা নির্ধারিত ইভেন্ট হ্যান্ডলারের jQuery এর ক্যাশে পাশাপাশি সেই উপাদানগুলিকে যুক্ত করার জন্য নেটিভ পদ্ধতি ব্যবহার করে এমন উভয়ের বিরুদ্ধে যাচাই করে:

(function($){

    $.find.selectors[":"].event = function(el, pos, match) {

        var search = (function(str){
            if (str.substring(0,2) === "on") {str = str.substring(2);}
            return str;
        })(String(match[3]).trim().toLowerCase());

        if (search) {
            var events = $._data(el, "events");
            return ((events && events.hasOwnProperty(search)) || el["on"+search]);
        }

        return false;

    };

})(jQuery);

উদাহরণ:

$(":event(click)")

এটি এমন উপাদানগুলিকে ফিরিয়ে দেবে যাগুলির সাথে একটি ক্লিক হ্যান্ডলার সংযুক্ত থাকে।

Answer 10

ECMAScript 5.1 / সহ একটি আধুনিক ব্রাউজারে Array.prototype.map, আপনি এটি ব্যবহার করতে পারেন

jQuery._data(DOCUMENTELEMENT,'events')["EVENT_NAME"].map(function(elem){return elem.handler;});

আপনার ব্রাউজার কনসোলে, যা হ্যান্ডলারের উত্স মুদ্রণ করবে, কমা সীমিত। কোনও নির্দিষ্ট ইভেন্টে কী চলছে তা এক নজর দেখার জন্য দরকারী।

Comments

jQuery._data('ct100_ContentPlaceHolder1_lcsSection','events')["EVENT_NAME"].map(function(elem){return elem.handler;}); আনকড টাইপ এরিয়ার: <নামবিহীন>: 1: 62

— মাইক ডব্লু

'ct100_ContentPlaceHolder1_lcsSection'একটি স্ট্রিং, কোনও ডম এলিমেন্ট নয়।

— জেসান ফাফন 21 '45

Answer 11

ইভেন্টগুলি ব্যবহার করে পুনরুদ্ধার করা যেতে পারে:

jQuery(elem).data('events');

বা jQuery 1.8+:

jQuery._data(elem, 'events');

দ্রষ্টব্য: ব্যবহারের সাথে আবদ্ধ ইভেন্টগুলি ব্যবহার করে $('selector').live('event', handler) পুনরুদ্ধার করা যেতে পারে:

jQuery(document).data('events')

Comments

jQuery (দস্তাবেজ)। ডেটা ('ইভেন্ট') আমাকে অপরিজ্ঞাত দেয়

— মাইক ডব্লু

Answer 12

আমাকে অনেক উত্তর আকর্ষণীয় বলে বলতে হবে, তবে সম্প্রতি আমার একটি অনুরূপ সমস্যা হয়েছিল এবং DOM পথে যেতেই সমাধানটি অত্যন্ত সহজ ছিল। এটি ভিন্ন কারণ আপনি পুনরাবৃত্তি করেন না তবে আপনার প্রয়োজন ইভেন্টে সরাসরি লক্ষ্য করুন তবে নীচে আমি আরও সাধারণ উত্তর দেব।

আমার এক সারি ছবি ছিল:

<table>
  <td><tr><img class="folder" /></tr><tr>...</tr></td>
</table>

এবং এই চিত্রটির সাথে একটি ক্লিক ইভেন্ট হ্যান্ডলার সংযুক্ত ছিল:

imageNode.click(function () { ... });

আমার উদ্দেশ্য ছিল ক্লিকযোগ্য অঞ্চলটি পুরো সারিতে প্রসারিত করা, তাই আমি প্রথমে সমস্ত চিত্র এবং আপেক্ষিক সারি পেয়েছি:

tableNode.find("img.folder").each(function () {
  var tr;

  tr = $(this).closest("tr");
  // <-- actual answer
});

এখন আসল অ্যানওয়ার লাইনে আমি আসল প্রশ্নের উত্তর দিয়ে ঠিক নীচে করেছিলাম:

tr.click(this.onclick);

সুতরাং আমি সরাসরি ডিওএম উপাদান থেকে ইভেন্ট হ্যান্ডলারটি এনেছি এবং এটিকে jQuery ক্লিক ইভেন্ট হ্যান্ডলারের মধ্যে রেখেছি। একটি যাদুমন্ত্র মত কাজ করে.

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

function walkTheDOM(node, func)
{
  func(node);
  node = node.firstChild;
  while (node)
  {
    walkTheDOM(node, func);
    node = node.nextSibling;
  }
}

function purgeEventHandlers(node)
{
  walkTheDOM(node, function (n) {
    var f;

    for (f in n)
    {
      if (typeof n[f] === "function")
      {
        n[f] = null;
      }
    }
  });
}

Answer 13

আপনি যদি ক্রোম ব্যবহার করছেন তবে jquery ডিবাগার প্লাগইন ব্যবহার করে দেখুন: https://chrome.google.com/webstore/detail/jquery-debugger/dbhhnnneeffddmlalhnehgclcmjimi?hl=en

Answer 14

এটি করার আরেকটি উপায় হ'ল উপাদানটি ধরতে jQuery ব্যবহার করা, তারপরে আসল জাভাস্ক্রিপ্টের মধ্য দিয়ে যেতে এবং সেট করতে এবং ইভেন্ট হ্যান্ডলারের সাথে খেলতে। এই ক্ষেত্রে:

var oldEventHandler = $('#element')[0].onclick;
// Remove event handler
$('#element')[0].onclick = null;
// Switch it back
$('#element')[0].onclick = oldEventHandler;

Comments

আমি মনে করি যে jQuery ইভেন্ট হ্যান্ডলিং অপ্টিমাইজেশন করে যা আমার মনে হয় যে এখানে আপনার কোড দ্বারা ছড়িয়ে দেওয়া হয়েছে।

— এমিল বার্গারন

ধন্যবাদ, হ্যাঁ আমার এই অনুভূতিটি হ্যাকি ছিল - সেই অপ্টিমাইজেশন সম্পর্কে আরও জানতে কোনও ভাল লিঙ্ক?

— টেমপ্রানোভা

Answer 15

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

var element = $("#some-element");

// sample event handlers
element.on("mouseover", function () {
  alert("foo");
});

$(".parent-element").on("mousedown", "span", function () {
  alert("bar");
});

$(document).on("click", "span", function () {
  alert("xyz");
});

var collection = element.parents()
  .add(element)
  .add($(document));
collection.each(function() {
  var currentEl = $(this) ? $(this) : $(document);
  var tagName = $(this)[0].tagName ? $(this)[0].tagName : "DOCUMENT";
  var events = $._data($(this)[0], "events");
  var isItself = $(this)[0] === element[0]
  if (!events) return;
  $.each(events, function(i, event) {
    if (!event) return;
    $.each(event, function(j, h) {
      var found = false;        
      if (h.selector && h.selector.length > 0) {
        currentEl.find(h.selector).each(function () {
          if ($(this)[0] === element[0]) {
            found = true;
          }
        });
      } else if (!h.selector && isItself) {
        found = true;
      }

      if (found) {
        console.log("################ " + tagName);
        console.log("event: " + i);
        console.log("selector: '" + h.selector + "'");
        console.log(h.handler);
      }
    });
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="parent-element">
  <span id="some-element"></span>
</div>

Answer 16

jQuery আপনাকে কোনও নির্দিষ্ট উপাদানের জন্য কেবল ইভেন্টগুলিতে অ্যাক্সেস করতে দিচ্ছে না। আপনি অননুমোদিত অভ্যন্তরীণ পদ্ধতি ব্যবহার করে এগুলি অ্যাক্সেস করতে পারেন

$._data(element, "events")

তবে এটি আপনাকে সমস্ত ইভেন্ট দেয় না, সুনির্দিষ্টভাবে আপনাকে নির্ধারিত ইভেন্টগুলি প্রদর্শন করবে না

$([selector|element]).on()

এই ইভেন্টগুলি দস্তাবেজের অভ্যন্তরে সঞ্চিত রয়েছে, তাই আপনি ব্রাউজ করে সেগুলি আনতে পারবেন

$._data(document, "events")

তবে এটি কঠোর পরিশ্রম, যেমন পুরো ওয়েবপৃষ্ঠার জন্য ইভেন্ট রয়েছে।

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

কী লক্ষ্য করা জরুরী, উপাদানটি আসলে HTMLElement, jQuery অবজেক্ট নয়।

function getEvents(element) {
    var elemEvents = $._data(element, "events");
    var allDocEvnts = $._data(document, "events");
    function equalEvents(evt1, evt2)
    {
        return evt1.guid === evt2.guid;
    }

    for(var evntType in allDocEvnts) {
        if(allDocEvnts.hasOwnProperty(evntType)) {
            var evts = allDocEvnts[evntType];
            for(var i = 0; i < evts.length; i++) {
                if($(element).is(evts[i].selector)) {
                    if(elemEvents == null) {
                        elemEvents = {};
                    }
                    if(!elemEvents.hasOwnProperty(evntType)) {
                        elemEvents[evntType] = [];
                    }
                    if(!elemEvents[evntType].some(function(evt) { return equalEvents(evt, evts[i]); })) {
                        elemEvents[evntType].push(evts[i]);
                    }
                }
            }
        }
    }
    return elemEvents;
}