您的位置:首页 > Web前端 > JavaScript

JS监听输入框值变化兼容 onpropertychange、oninput

2015-06-29 17:17 253 查看
onpropertychange 属IE

oninput 属除IE外(Chrome、Firefox、SS)

所以肯简单的办法嘛:

1. 一个input里面写两个属性事件

2.写在JS中判断浏览器添加监听事件

<script type="text/javascript">
function immediately() {
element = document.getElementById("mytext");
if (window.ActiveXObject) {
element.onpropertychange = webChange;
} else {
element.addEventListener("input", webChange, false);
}
}
function webChange() {
if (element.value) {
document.getElementById("test").innerHTML = element.value;
}
;
}
</script>

Input:
<input type="text" name="textfield" oninput="document.getElementById('webtest').innerHTML=this.value;" onpropertychange="document.getElementById('webtest').innerHTML=this.value;" />
<div>您输入的值为:<span id="webtest"></span></div>
<br /><br /><br /><br /><br />
JS:
<input type="text" name="textfield" id="mytext" />
<div>您输入的值为:<span id="test"></span></div>
<script type="text/javascript">
immediately();
</script>


效果:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: