页面的onchange事件及其不足和应对

最新推荐文章于 2021-06-03 21:00:52 发布

geminiroy

最新推荐文章于 2021-06-03 21:00:52 发布

阅读量432

点赞数

分类专栏： JavaScript/AJAX 文章标签： input function firefox ie 浏览器测试

本文链接：https://blog.csdn.net/geminiroy/article/details/6127285

版权

JavaScript/AJAX 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

一、onchange
一般input type text的onchange事件的触发需要两个条件：1.输入框的值发生了改变；2.该文本框失去了焦点，而真正的事件的触发却是发生在该文本框失去焦点的时候，如果需要当值改变的时候就去触发，则需要用onpropertychange或者是oninput。

二、onpropertychange/oninput
1.在IE下,可以用onpropertychange来代替onchange事件,当文本框有任何变化时,能立即触发此事件.
2.在其他浏览器下可以使用oninput事件来达到onpropertychange事件同样的效果

三、使用onpropertychange/oninput的两种方式
1.在页面直接使用
<input type="text" name="myname" οninput="alert(this.value);" onpropertychange="alert(this.value)" />
2.把他们分离到js中的使用
注意在js中使用他们的时候oninput和普通事件注册的方法有些不同，必须使用addEventListener来注册。
<mce:script type="text/javascript"></mce:script> <body> <input type="text" name="myname" id="myname" /> <mce:script type="text/javascript"></mce:script>

经过测试，兼容：IE6、IE7、IE8、Firefox