【JavaScript】onchange 与 oninput 事件的区别

oninput 事件适用于以下标签:

<input type=”password”>
<input type=”search”>
<input type=”text”> 
<textarea>

oninput 与 onchange 事件的区别:

    onchange事件在输入框失去焦点时触发;oninput在输入框内容发生改变时立即触发,因此用户每输入或删除一个字符都会触发该事件。 onchange还适用于select标签。

oninput事件处理实例:

<!DOCTYPE html>
<html>
	<head>
		<title>oninput attribute</title>
		<style>
			body {
            
     
				text-align:center;
			}
			h1 {
            
     
				color:green;
			}
		</style>
	</head>
	<body>
		<h1>GeeksforGeeks</h1>
		<h2>oninput Attribute</h2>
		Enter some Text here: <input type="text" id="GFG"
		oninput="Geeks()">
		<p id="sudo"></p>


		<script>
			function Geeks() {
            
     
				var x = document.getElementById("GFG").value;
				document.getElementById("sudo").innerHTML =
				"Entered Text: " + x;
			}
		</script>
	</body>
</html>
经验分享 程序员 微信小程序 职场和发展