JavaScript Events Kya Hote Hain?

Events ka Introduction

JavaScript events web pages par hone wali ghatnayein hain, jaise user ka button par click karna, keyboard se kuch type karna, ya page ka load hona. In events ko "listen" karke hum specific JavaScript functions (jinhe Event Handlers kehte hain) run kar sakte hain. Yeh process web pages ko static se dynamic aur interactive banata hai.

Common Event Types

1. Mouse Events

Yeh events user ke mouse actions se trigger hote hain.

2. Keyboard Events

Yeh events keyboard interactions se trigger hote hain.

3. Form Events

Yeh events HTML forms ke saath interaction par trigger hote hain.

4. Window/Document Events

Yeh events browser window ya document par trigger hote hain.

Event Handling ke Tarike

Event Listeners (Best Practice)

Modern JavaScript me, addEventListener() method ka use karna events handle karne ka sabse accha tarika hai. Isse aap ek hi element par multiple events laga sakte hain aur code ko clean rakh sakte hain.

// HTML
<button id="myBtn">Click Me</button>

// JavaScript
const myButton = document.getElementById("myBtn");

myButton.addEventListener("click", function() {
  document.body.style.backgroundColor = "lightblue";
});

The Event Object

Jab bhi koi event trigger hota hai, toh browser ek event object create karta hai. Is object me event ke baare me saari jaankari hoti hai, jaise ki kaunsa element target hua, mouse ki position kya thi, etc.

myButton.addEventListener("click", function(event) {
  console.log("Event Type:", event.type); // "click"
  console.log("Target Element:", event.target); // <button id="myBtn">...</button>
});

Key Takeaways

• Events user ke actions (clicks, key presses) hote hain jo web page par hote hain.
• Event Handlers woh JavaScript functions hain jo in events par respond karte hain.
• addEventListener() modern aur recommended tarika hai events handle karne ka.
• Event Object event ke baare me saari details provide karta hai.
• event.preventDefault() ka use karke aap kisi bhi event ke default behavior (jaise form submission) ko rok sakte hain.