জাভাস্ক্রিপ্ট ইভেন্ট ম্যানেজমেন্ট
ইভেন্ট ম্যানেজমেন্ট হল ইভেন্ট যোগ করা, মুছে ফেলা এবং নিয়ন্ত্রণ করা।
ঘটনা যোগ করা হচ্ছে
উদাহরণ
<button id="btn">ক্লিক করুন</button> <p id="demo"></p> <script> const btn = document.getElementById("btn"); // বোতামের জন্য একটি ক্লিক কল করুন btn.addEventListener("ক্লিক", myFunction); ফাংশন myFunction() { document.getElementById("demo").innerHTML = "ক্লিক করা হয়েছে!"; } </script>
বর্ণনা:
addEventListener() পদ্ধতিটি একটি HTML উপাদানে একটি ইভেন্ট লিসেনার যোগ করতে ব্যবহৃত হয়। এই উদাহরণে, "btn" বোতামে ক্লিক ইভেন্টের জন্য একজন শ্রোতা যোগ করা হয়েছে।
ইভেন্ট মুছে ফেলা হচ্ছে
উদাহরণ
<button id="add">যোগ করুন</button> <button id="remove">সরান</button> <button id="test">পরীক্ষা ক্লিক</button> <p id="demo"></p> <script> const test = document.getElementById("test"); const remove = document.getElementById("রিমুভ"); const add = document.getElementById("add"); ফাংশন myFunction() { document.getElementById("demo").innerHTML += "হ্যালো!"; } // যোগ বোতামের জন্য একটি ক্লিক কল করুন add.addEventListener("ক্লিক", ফাংশন () { // পরীক্ষার বোতামের জন্য একটি ক্লিক কল করুন test.addEventListener("ক্লিক", myFunction); }); // অপসারণ বোতামে একটি ক্লিকের জন্য শুনুন remove.addEventListener("ক্লিক", ফাংশন () { // পরীক্ষা বোতামটি ক্লিক করা থেকে আটকান test.removeEventListener("ক্লিক", myFunction); }); </script>
দ্রষ্টব্য:
একটি ইভেন্ট শ্রোতা অপসারণ করতে, আপনাকে অবশ্যই একই নামের ফাংশনটি ব্যবহার করতে হবে যা আপনি এটি যোগ করতে ব্যবহার করেছিলেন৷
ঘটনা প্রতিরোধ
উদাহরণ
ব্লক ডিফল্ট (একটি সংযোগ ব্লক করতে)
<a href="https://www.jassifteam.com" id="link">জাসিফ টিমে যান</a> <p id="demo"></p> <script> const link = document.getElementById("লিঙ্ক"); // লিঙ্কের জন্য একটি ক্লিকের অনুরোধ করুন link.addEventListener("ক্লিক", ফাংশন (ইভেন্ট) { event.preventDefault(); document.getElementById("demo").innerHTML = "লিঙ্ক অবরুদ্ধ!"; }); </script>
preventDefault():
প্রতিরোধ ডিফল্ট() পদ্ধতিটি একটি ইভেন্টের ডিফল্ট ক্রিয়া প্রতিরোধ করতে ব্যবহৃত হয়। উদাহরণস্বরূপ, যখন একটি লিঙ্কে ক্লিক করা হয় তখন এটি আপনাকে ডিফল্টরূপে একটি নতুন পৃষ্ঠায় নিয়ে যায়। preventDefault() এই ডিফল্ট ক্রিয়া প্রতিরোধ করবে।