Computer >> कंप्यूटर >  >> प्रोग्रामिंग >> Javascript

जावास्क्रिप्ट में गतिशील तत्वों को ईवेंट संलग्न करें?

<घंटा/>

ईवेंट संलग्न करने के लिए, JavaScript में document.addEventListener() का उपयोग करें। निम्नलिखित कोड है -

उदाहरण

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initialscale=1.0">
<title>Document</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
<input type="button" value="submit" id="buttonSubmit" />
<script>
   document.addEventListener('click',function(event){
      if(event.target && event.target.id== 'buttonSubmit'){
         console.log("Event generation on the button click")
      }
   });
</script>
</body>
</html>

उपरोक्त प्रोग्राम को चलाने के लिए, फ़ाइल नाम "anyName.html(index.html)" को सेव करें और फ़ाइल पर राइट क्लिक करें। वीएस कोड संपादक में "लाइव सर्वर के साथ खोलें" विकल्प चुनें।

आउटपुट

यह निम्नलिखित आउटपुट देगा -

जावास्क्रिप्ट में गतिशील तत्वों को ईवेंट संलग्न करें?

सबमिट बटन पर क्लिक करने के बाद, स्क्रीनशॉट इस प्रकार है -

जावास्क्रिप्ट में गतिशील तत्वों को ईवेंट संलग्न करें?


  1. जावास्क्रिप्ट का उपयोग करके कुछ तत्वों पर माउस ईवेंट को कैसे अक्षम करें?

    जावास्क्रिप्ट का उपयोग करके कुछ तत्वों पर माउस ईवेंट को अक्षम करने के लिए निम्नलिखित कोड है - उदाहरण <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0&quo

  1. जावास्क्रिप्ट ENTER दबाने पर टेक्स्टबॉक्स सबमिट करें?

    ENTER में कुंजी कोड 13 है। हम ENTER को दबाया गया है या नहीं, यह जांचने के लिए event.keycode का उपयोग करेंगे। निम्नलिखित कोड है - उदाहरण <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=de

  1. जावास्क्रिप्ट में एक डोम नोड के सभी बाल तत्वों को निकालें?

    चाइल्ड तत्वों को हटाने के लिए, आंतरिक HTML को पर सेट करें। उदाहरण निम्नलिखित कोड है - <!DOCTYPE html> <html lang="en"> <head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-sc