使用场景:
示例代码:
- <!DOCTYPE html>
- <html>
- <head>
- <title>onchange Event Example</title>
- </head>
- <body>
- <label for="inputText">Enter Text:</label>
- <input type="text" id="inputText" onchange="handleChange()">
-
- <p id="output"></p>
-
- <script>
- function handleChange() {
- var input = document.getElementById("inputText").value;
- document.getElementById("output").innerText = "You entered: " + input;
- }
- </script>
- </body>
- </html>
在这个例子中,我们创建了一个文本输入框和一个段落元素,当用户在文本输入框中输入内容并且移开焦点时(值发生改变时),会触发 handleChange 函数,该函数获取输入框中的值并将其显示在段落元素中。