onpropertychange oninput兼容性

函数

onpropertychange事件:IE专有,disable=true的时候失效,onpropertychange是在触发对象改变任何属性时都会触发。onpropertychange==onchange+onblur。onchange只有在用键盘改变其值，然后在失去焦点(onblur)后才触发。

oninput 事件：JS 改变 value 值时不能触发，下拉列表中选值时，也不会触发。

修改方法：

使用
$(选择器).on(事件名, 处理函数) / $(选择器).off(事件名, 处理函数)
来替代原生JS中的
elem.attachEvent(‘on’ + 事件名, 处理函数) / elem.detachEvent(‘on’ + 事件名,     处理函数) — IE
elem.addEventListener(事件名, 处理函数) / elem.addEventListener(事件名, 处 理函数) — chrome

案例：

1、onpropertychange：适用IE，谷歌不适用。IE：监听所有属性，也适用js 改变 value

<input name="fundName" id="fundName" type="hidden" value='<DM:DocumentTag field="fundName"/>'
onpropertychange="{if(''==this.value){return;}var vtime = document.f1.sys_createtime.value;vtime = vtime.substring(0,10).replace(/\-/gi,'');document.f1.sys_title.value = vtime+'【'+this.value+'】'+'<%=strshowName%>'; }">

2、IE，谷歌都适用()，谷歌js 改变 value 时，却不会触发oninput

<input name="fundName1" id="fundName1" type="text" value='<DM:DocumentTag field="fundCode"/>' onpropertychange="immediately()" oninput="immediately()">function immediately(){ alert("0");var element = document.getElementById("fundName1"); if( window.ActiveXObject) { element.onpropertychange = setTitle; }else{ element.addEventListener("input",setTitle,false); } }
function setTitle(){alert("1");var fundName = document.getElementById("fundName1");if(''==fundName.value){return;}var vtime = document.f1.sys_createtime.value;vtime = vtime.substring(0,10).replace(/\-/gi,'');document.f1.sys_title.value = vtime+'【'+fundName.value+'】'+'<%=strshowName%>';
}

3、IE，谷歌都适用()，谷歌js 改变 value 时，触发oninput

方法：监听对象添加定时器

<td width="124" height="23" align="center" bgcolor="#efefef">基金名称</td>
<td  bgcolor="#FFFFFF"><input name="fundCode" id="fundCode" type="hidden" value='<DM:DocumentTag field="fundCode"/>'>//监听对象<input name="fundName" id="fundName" type="hidden" value='<DM:DocumentTag field="fundName"/>'onpropertychange="{if(''==this.value){return;}var vtime = document.f1.sys_createtime.value;vtime = vtime.substring(0,10).replace(/\-/gi,'');document.f1.sys_title.value = vtime+'【'+this.value+'】'+'<%=strshowName%>'; }"><input type="button" onclick="selectFundInfo()" value="&nbsp;请点击选择基金&nbsp;"><U><span id="showFund"><DM:DocumentTag field="fundName"/></span></U>
</td>$(function() {if( window.ActiveXObject) { //IE}else{//其他：谷歌...var intervalName;   // 定时器句柄  var fundNames = document.getElementById("fundName"); fundNames.addEventListener("input",setTitle,false); setInterval(checkChange,1000);function checkChange(){var intervalNames = fundNames.value;if(intervalNames!= intervalName){setTitle(fundNames);intervalName = fundNames.val();}}}
});function setTitle(fundNames){if(''==fundNames.value){return;}var vtime = document.f1.sys_createtime.value;vtime = vtime.substring(0,10).replace(/\-/gi,'');document.f1.sys_title.value = vtime+'【'+fundNames.value+'】'+'<%=strshowName%>';
}

4、onchange后监听：

<select name="<%=strUserSelId%>_show" id="<%=strUserSelId%>_show" style="width:118px;margin-left:-100px" onchange="this.parentNode.nextSibling.value=this.options[this.selectedIndex].innerHTML;setUserSearchValue(this);setuserboxValue();"><option value='' selected>请选择</option>
</select>
<input name="problemer" id="problemer" type="hidden" class="tab4" size="30" value='<DM:DocumentTag field="problemer"/>'>function setuserboxValue(){if( window.ActiveXObject) { //IE}else{//其他：谷歌...var intervalName;   // 定时器句柄  var problemer = document.getElementById("problemer"); problemer.addEventListener("input",setUserboxValue,false); setInterval(checkChange,1000);function checkChange(){var intervalNames = problemer.value;if(intervalNames!= intervalName){var problemercode = document.getElementById("<%=strUserSelId%>_show"); setUserboxValue(problemer.value);intervalName = problemer.value;}}}
}function setUserboxValue(obj)
{document.getElementById("userbox").value = obj
}

onpropertychange oninput兼容性相关推荐

asp.net监听输入框值的即时变化onpropertychange、oninput
要达到的效果很多情况下我们都会即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感.比如即时显示输入框已经被输入的字节数,或者即时读取输入的值来进行搜索引导,也就是google的 ...
input缓存中选值事件触发
现在浏览器都会缓存一些input框输入的内容,这些内容只是为了以后填写方便,一般是点击两次input框就会显示像下拉框一样的选项框,但在这个框里选择的值被填充到input框中时不会触发chang,fo ...
jquery的实时触发事件(textarea实时获取中文个数)
jquery的实时触发事件(textarea实时获取中文个数) (2014-09-16 11:49:50) 转载▼ 标签: 实时触发事件中文个数 onpropertychange oninput o ...
input输入框输满3个字符自动跳到下一个input输入框
html代码: <div id="demo"><form action=""><input type="text&quo ...
input输入框点击回车切换到下一个输入框功能
直接上代码: HTML: <form class="layui-form" action="../in" id="form" meth ...
oninput事件onpropertychange事件onchange事件textIput事件
oninput事件&onpropertychange事件&onchange事件&textIput事件 oninput事件简介 input,select,textarea元素值 ...
onchange onpropertychange 和oninput事件的区别
汇总onchange onpropertychange 和oninput事件的区别: 1.onchange事件与onpropertychange事件的区别: onchange事件在内容改变(两次内容 ...
oninput,onpropertychange,onchange的用法和区别
1.前言由于工作需要,需实现一个类似于微博输入框的功能,在用户动态输入文字的时候,修改提示"您还可以输入XX字".如下图所示: 因此,稍微研究了一下oninput,onprope ...
文本监控：oninput onchange onpropertychange 的区别
oninput: 实时监控输入文本,当文本有改变时触发(非离开焦点),非IE(IE9以上支持)浏览器都支持(js赋值不触发); onpropertychange:实时监控输入文本,当文本有改变时触发( ...
同时绑定onpropertychange 和 oninput 事件，实时检测 input、textarea输入改变事件，支持低版本IE，支持复制粘贴...
实时检测 input.textarea输入改变事件,支持低版本IE,支持复制粘贴检测input.textarea输入改变事件有以下几种: 1.onkeyup/onkeydown 捕获用户键盘输入事件 ...