মূল বিষয়বস্তু
কম্পিউটার প্রোগ্রামিং
কোর্স: কম্পিউটার প্রোগ্রামিং > অধ্যায় 6
পাঠ 5: DOM ইভেন্ট- ইভেন্ট (event) ব্যবহার করার মাধ্যমে ওয়েবপেজ ইন্টার্যাক্টিভ করা
- ইভেন্ট লিসেনার (event listener) যোগ করা
- চ্যালেঞ্জ: বিড়াল ক্লীক করা
- DOM (ডম) ইভেন্টের (event) প্রকারভেদ
- ইভেন্টের বৈশিষ্ট্যসমূহ ব্যবহার করা
- চ্যালেঞ্জ: বিড়ালের মোছ
- ইভেন্ট দিয়ে ফর্ম প্রসেস করা
- চ্যালেঞ্জ: ম্যাড লিব্স
- ইভেন্টের ডিফল্ট আচরণ রোধ করা
- সারাংশ: DOM ইভেন্ট
© 2023 Khan Academyব্যবহারের শর্তাদিগোপনীয়তার নীতিমালাকুকি নোটিশ
সারাংশ: DOM ইভেন্ট
ইভেন্ট লিসেনার (event listeners) যোগ করা
ওয়েবসাইটের কোন অংশে একটি ইভেন্টের জন্য ব্রাউজারের একটি নির্দিষ্ট ফাংশনকে কল করার ক্ষেত্রে, অবশ্যই
document.addEventListener
ব্যবহার করতে হয়:var buttonEl = document.getElementById("clicker");
var onButtonClick = function() {
console.log("Oh golly gosh, you clicked me");
};
buttonEl.addEventListener("click", onButtonClick);
প্রথম আর্গুমেন্ট হিসেবে, যে কোন স্ট্রিং ব্যবহারযোগ্য, আরও জানতে ইভেন্টের প্রবন্ধটি দেখা উচিত।
হয়ে যাওয়া ইভেন্ট সম্পর্কে জানতে চাইলে কলব্যাক ফাংশনে, ব্রাউজারের পাঠানো ইভেন্ট অবজেক্টটি দেখতে হবে:
var faceEl = document.getElementById("face");
var onFaceClick = function(e) {
console.log("You clicked " + e.clientX + " , " + e.clientY);
};
faceEl.addEventListener("click", onFaceClick);
ইভেন্ট অবজেক্টের অনেক বৈশিষ্ট্য আছে, এটার পূর্ণ তালিকা দেখার জন্য এখানে ক্লিক কর।
ফর্মের কোন ঠিকানায় (link) বা সাবমিটে (submit) ক্লিক করা অগ্রাহ্য করলে, ব্রাউজারের ডিফল্ট আচরণ রোধে অবশ্যই
event.preventDefault()
কে কল করতে হবে।ইভেন্ট লিসেনার বাদ দেয়া
ইভেন্ট লিসেনারের দরকার না থাকলে, এটা
removeEventListener
ব্যবহার করে বাদ দেওয়া যায়:var faceEl = document.getElementById("face");
var onFaceClick = function(e) {
console.log("You clicked " + e.clientX + " , " + e.clientY);
};
faceEl.addEventListener("click", onFaceClick);
// later...
faceEl.removeEventListener("click", onFaceClick);
আলোচনায় অংশ নিতে চাও?
কোন আলাপচারিতা নেই।