Javascript DOM oninput Event via addEventListener() method

Introduction

In JavaScript, using the addEventListener() method: 

object.addEventListener("input",
       myScript);

This example uses the addEventListener() method to attach an "input" event to an input element.

Write something in the text field to trigger a function. 

<!DOCTYPE html>//from w w  w  . jav a 2  s. c  om
<html>
<body>
Enter name: <input type="text" id="myInput" value="Mickey">
<p id="demo"></p>
<script>
document.getElementById("myInput").addEventListener("input", myFunction);

function myFunction() {
  document.getElementById("demo").innerHTML = "The value of the input field was changed.";
}
</script>

</body>
</html>

MultiLlineTable:
Bubbles:                 Yes
Cancelable:              No
Event type:              Event, InputEvent
Supported HTML tags:     <input type="color">, 
                         <input type="date">, 
                         <input type="datetime">,
                         <input type="email">, 
                         <input type="month">, 
                         <input type="number">, 
                         <input type="password">, 
                         <input type="range">, 
                         <input type="search">, 
                         <input type="tel">, 
                         <input type="text">, 
                         <input type="time">, 
                         <input type="url">, 
                         <input type="week"> and 
                         <textarea>



PreviousNext

Related