Web HTML 内容改变的触发事件方式

Web HTML 内容改变的触发事件方式

1、onpropertychange //会在元素的属性改变时,实时触发事件。但当元素 disable=true 时不会触发。
缺点：IE 下支持，其他浏览器不支持，可用 oninput 来解决。

<input type="text" id="TaoRoy" onpropertychange="functionName()">

2、onchange //在域内容改变时触发（值改变且失去焦点时触发）。支持的标签有 <input type="text">、<textarea>、<select>、<keygen>。
缺点：通过js代码改变相应的值时不会触发，可通过调用其change 的function() 或者调.change()方法来解决。

<input type="text" id="TaoRoy" onchange="function()">

3、oninput
oninput在<input>或<textarea>的值发生改变时触发，不需要等到元素失去焦点，是实时的。它是HTML5的事件，可用于检测文本类输入框的值。
缺点：1）通过修改脚本中的值时不会触发. 2）从浏览器下拉提示框里选取值时不会触发. 3）IE9 以下不支持，但 IE9以下可用onpropertychange 事件代替。

<input type="text" oninput="function()">

4、addEventListener //用于向指定元素添加事件方法
语法： element.addEventListener(event, function, useCapture)
注意：可使用removeEventListener()方法来移除添加的事件。IE9以下不支持，可用attachEvent代替。

 

 

 

 

创建时间：2022.04.19　　更新时间：