使用场景:
- onchange 事件常用于表单元素(如 input、select、textarea 等)的值发生改变时触发相应的操作。
- 可以用于实时监测用户输入的内容,进行验证或实时更新相关内容。
示例代码:
<!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 函数,该函数获取输入框中的值并将其显示在段落元素中。