जावास्क्रिप्ट घटनाक्रम
HTML ईवेंट "चीजें" हैं जो HTML तत्वों के साथ होती हैं।
जब HTML पृष्ठों में जावास्क्रिप्ट का उपयोग किया जाता है, तो जावास्क्रिप्ट इन घटनाओं पर "प्रतिक्रिया" कर सकता है।
एचटीएमएल घटनाक्रम
एक HTML ईवेंट कुछ ऐसा हो सकता है जो ब्राउज़र करता है, या कुछ ऐसा जो उपयोगकर्ता करता है।
यहां HTML ईवेंट के कुछ उदाहरण दिए गए हैं:
- एक HTML वेब पेज ने लोड करना समाप्त कर दिया है
- एक HTML इनपुट फ़ील्ड बदल दिया गया था
- एक HTML बटन क्लिक किया गया था
अक्सर, जब घटनाएँ घटती हैं, तो आप कुछ करना चाह सकते हैं।
घटनाओं का पता चलने पर जावास्क्रिप्ट आपको कोड निष्पादित करने देता है।
HTML HTML तत्वों में जावास्क्रिप्ट कोड के साथ ईवेंट हैंडलर विशेषताओं को जोड़ने की अनुमति देता है।
सिंगल कोट्स के साथ:
<element
event='some JavaScript'>
दोहरे उद्धरण चिह्नों के साथ:
<element
event="some JavaScript">
निम्नलिखित उदाहरण में, एक onclickविशेषता (कोड के साथ) को एक
<button>तत्व में जोड़ा जाता है:
उदाहरण
<button onclick="document.getElementById('demo').innerHTML = Date()">The time is?</button>
ऊपर के उदाहरण में, जावास्क्रिप्ट कोड आईडी = "डेमो" के साथ तत्व की सामग्री को बदलता है।
अगले उदाहरण में, कोड अपने स्वयं के तत्व की सामग्री को बदलता है (का उपयोग करके this.innerHTML):
उदाहरण
<button onclick="this.innerHTML = Date()">The time is?</button>
जावास्क्रिप्ट कोड अक्सर कई लाइन लंबा होता है। ईवेंट विशेषताएँ कॉलिंग फ़ंक्शंस देखना अधिक सामान्य है:
उदाहरण
<button onclick="displayDate()">The time is?</button>
सामान्य HTML ईवेंट
यहां कुछ सामान्य HTML ईवेंट की सूची दी गई है:
| आयोजन | विवरण |
|---|---|
| परिवर्तन पर | एक HTML तत्व बदल दिया गया है |
| क्लिक पर | उपयोगकर्ता एक HTML तत्व पर क्लिक करता है |
| मूषक के ऊपर से | उपयोगकर्ता माउस को HTML तत्व पर ले जाता है |
| घर से बाहर | उपयोगकर्ता माउस को HTML तत्व से दूर ले जाता है |
| ऑनकीडाउन | उपयोगकर्ता एक कीबोर्ड कुंजी दबाता है |
| गोली भरना | ब्राउज़र ने पृष्ठ लोड करना समाप्त कर दिया है |
सूची बहुत लंबी है: W3Schools JavaScript Reference HTML DOM Events ।
जावास्क्रिप्ट इवेंट हैंडलर
ईवेंट हैंडलर का उपयोग उपयोगकर्ता इनपुट, उपयोगकर्ता क्रियाओं और ब्राउज़र क्रियाओं को संभालने और सत्यापित करने के लिए किया जा सकता है:
- हर बार पेज लोड होने पर की जाने वाली चीज़ें
- पेज बंद होने पर क्या करना चाहिए?
- वह क्रिया जो उपयोगकर्ता द्वारा बटन पर क्लिक करने पर की जानी चाहिए
- वह सामग्री जिसे सत्यापित किया जाना चाहिए जब कोई उपयोगकर्ता डेटा इनपुट करता है
- और अधिक ...
जावास्क्रिप्ट को घटनाओं के साथ काम करने देने के लिए कई अलग-अलग तरीकों का इस्तेमाल किया जा सकता है:
- HTML ईवेंट विशेषताएँ सीधे JavaScript कोड निष्पादित कर सकती हैं
- HTML ईवेंट विशेषताएँ JavaScript फ़ंक्शन को कॉल कर सकती हैं
- आप अपने स्वयं के ईवेंट हैंडलर फ़ंक्शन को HTML तत्वों को असाइन कर सकते हैं
- आप ईवेंट को भेजे जाने या प्रबंधित होने से रोक सकते हैं
- और अधिक ...
आप HTML DOM चैप्टर में ईवेंट और ईवेंट हैंडलर के बारे में बहुत कुछ सीखेंगे।