জাভাস্ক্রিপ্ট addEventListener() প্রদান করে পদ্ধতি যা একটি ইভেন্ট হ্যান্ডলার সংযুক্ত করে নির্দিষ্ট উপাদানে। এই পদ্ধতিটি বিদ্যমান ইভেন্ট হ্যান্ডলারকে ওভাররাইট না করে একটি উপাদানের সাথে একটি ইভেন্ট হ্যান্ডলার সংযুক্ত করে। একটি সময়ে একটি উপাদানে অনেক ইভেন্ট হ্যান্ডলার যোগ করা সম্ভব৷
৷addEventListener() পদ্ধতিটি ইভেন্টটি বুদবুদ-এ কীভাবে প্রতিক্রিয়া দেখায় তা নিয়ন্ত্রণ করা সহজ করে . আমরা অনেক ইভেন্ট প্রয়োগ করতে পারি যেমন মাউসওভার, ক্লিক ইত্যাদি।
উদাহরণ
নিম্নলিখিত উদাহরণে, মাউসওভার ঘটনা বরাদ্দ করা হয়। সুতরাং যখন আমরা বোতামে একটি মাউস রাখি, তখন আমরা আউটপুটে দেখানো অনুরুধিত পাঠ্যটি পাব।
<html> <body> <p>This example uses the addEventListener() method to attach a mouseover event to a button.</p> <input type = "button" id="myBtn" value = "listener"> <p id="listener"></p> <script> document.getElementById("myBtn").addEventListener("mouseover", displayText); function displayText() { document.getElementById("listener").innerHTML = document.write("Tutorix is the best e-learning platform"); } </script> </body> </html>
যখন আমরা উপরের কোডটি কার্যকর করব তখন আমরা স্ক্রিনে নিম্নলিখিতটি প্রদর্শিত হবে।
যখন আমরা মাউসওভার করি "শ্রোতা" বোতামে, তারপর নিম্নলিখিত আউটপুটটি কার্যকর করা হয়৷
৷আউটপুট