javascript 监听文本框输入

最新推荐文章于 2024-05-04 20:52:28 发布

xiaoqichuan

最新推荐文章于 2024-05-04 20:52:28 发布

阅读量675

点赞数

分类专栏： javascript 文章标签： javascript php ViewUI

本文链接：https://blog.csdn.net/xiaoqichuan/article/details/84599213

版权

javascript 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

Firefox、Chrome、IE9，IE10 均支持 oninput 事件，此外所有版本的 IE 均支持 onpropertychange 事件。

oninput 事件在用户输入、退格（backspace）、删除（delete）、剪切（ctrl + x）、粘贴（ctrl + v）及鼠标剪切与粘贴时触发（在 IE9 中只在输入、粘贴、鼠标粘贴时触发）。

onpropertychange 事件在用户输入、退格（backspace）、删除（delete）、剪切（ctrl + x）、粘贴（ctrl + v）及鼠标剪切与粘贴时触发（在 IE9 中只在输入、粘贴、鼠标粘贴时触发）（仅 IE 支持）。

backspace、delete 两个按键的 keyCode 分别为 8、46。

oncut 事件在剪切（ctrl + x）、鼠标剪切时触发。

<!DOCTYPE html>
<html>
<head>
    <meta charset="gbk"/>
    <title>监听文本框输入</title>
</head>
<body>
<input type="text" value="" id="io" />
<p id="dis"></p>
<script type="text/javascript">
// 监听文本框输入
var input = document.getElementById("io");
var dis = document.getElementById("dis");
function fn() {
  // 你要执行的代码
  dis.innerHTML = dis.innerHTML+'+';
}
if(window.addEventListener) { //W3C
	input.addEventListener("input", fn, false);
}
else if(window.attachEvent) { //IE
  	input.attachEvent("onpropertychange", fn);
}
if(window.VBArray && window.addEventListener) { //IE9
	input.attachEvent("onkeydown", function() {
		var key = window.event.keyCode;
		if ((key == 8 || key == 46) && input.value != '') fn(); //处理回退与删除
	});
	input.attachEvent("oncut", fn);//处理剪切
}
</script>
</body>
</html>

转载：

http://www.58lou.com/separticle.php?artid=220

参考：

http://calefy.org/2012/11/12/javascript-key-events-and-input-control.html