兼容Firefox和IE的onpropertychange事件oninput

最新推荐文章于 2019-06-28 09:27:52 发布
最新推荐文章于 2019-06-28 09:27:52 发布
阅读量1.8k 收藏
点赞数
分类专栏： js 文章标签： js
<html>
<head></head>
<body>
<div id="msg">输入的文字长度为：14</div>
<input id="txt" value="">
<script>
//当状态改变的时候执行的函数
function handle()
{document.getElementById('msg').innerHTML='输入的文字长度为：'+document.getElementById('txt').value.length;
}
//firefox下检测状态改变只能用oninput,且需要用addEventListener来注册事件。
if(/msie/i.test(navigator.userAgent)) //ie浏览器
{document.getElementById('txt').onpropertychange=handle
}
else
{//非ie浏览器，比如Firefox
document.getElementById('txt').addEventListener("input",handle,false);
}
</script>
</body>
</html>

bob007
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
javascript开发中使用onpropertychange,oninput事件解决onchange事件的不足
10-28
使用onpropertychange和oninput事件解决onchange不足 * { font-size: 14px; font-family: 'Comic Sans MS', Verdana; } body { margin-left: 20px; } 使用onchange事件: <input type="text" id="txt...
input标签内容改变触发的事件
weixin_33937913的博客
11-19 624
原生方法 onchange事件 <input type="text" onchange="onc(this)"> function onc(data){ console.log(data.value); } onchange事件在内容改变且失去焦点的时候触发。即，失去焦点了内容未变不触发，内容变了未失去焦点也不实时触发...
input值改变事件兼容代码（用于做自动补全）
ITbasketplayer的专栏
09-11 988
id="msg">   id='txt' value="" />     //当状态改变的时候执行的函数   function handle()   {document.getElementById('msg').innerHTML='输入的文字长度为：'+document.getElementById('txt').value.len
input 内容改变的触发事件
MaQuanXin的博客
06-28 1227
input 内容改变的触发事件 onchange onchange 事件会在域的内容改变时触发。支持的标签, , ,。 注意：在元素的值改变了且失去焦点时触发（两次的值一样不会触发）。 缺陷：通过js代码改变DOM的值不会触发，解决在js代码里改值了调用其change 的function() 或者调.change()方法。 JS： <input type="text" id="cc" o...
input内容改变的触发事件
段占彪的博客
11-26 2万+
onchange 定义和用法 onchange 事件会在域的内容改变时发生。 onchange 事件也可用于单选框与复选框改变后触发的事件。 语法 HTML 中: &amp;amp;amp;amp;lt;input onchange=&amp;amp;amp;quot;SomeJavaScriptCode&amp;amp;amp;quot;&amp;amp;amp;amp;gt; JavaScript 中: object.onchange=func
FireFox下因为不支持onPropertyChange，watch方法来代替
蜗牛的专栏
08-04 706
watch（Object.watch 方法） public watch(name:String, callback:Function, [userData:Object]) : Boolean 注册当 ActionScript 对象的指定属性更改时要调用的事件处理函数。当该属性发生更改时，用 myObject 作为包含对象调用此事件处理函数。 您可以在 callback 方法定义
Input 特殊事件onpopertychange和oninput
09-06
相比之下，`oninput` 事件是在更广泛的现代浏览器中得到支持的，包括Opera、Safari、NetScape和Firefox等。`oninput` 主要用于监听输入元素（如`<input>`和`<textarea>`）的`value`属性的变化，即当用户在这些元素中...
input 输入框内的输入事件详细分析
09-05
`input`事件在Chrome、Firefox和Opera中支持良好，但需通过`addEventListener`进行绑定，而IE则更适合使用`onpropertychange`，并可以通过`on`或`attachEvent`绑定。对于这些差异，开发者需要编写兼容性代码以确保在...
firefox 下的 onpropertychange
04-02 89
<html> <script> varinsObj=newArray(); vartimer=null; function$(id){returndocument.getElementById(id)}; functionchangeInspector(id){ insObj[id]=""+$(id).value; timer=setI...
firefox中的onpropertychange替代方案
04-30 277
document.getElementById('tx1').watch("innerHTML", function (id, oldval, newval) { console.log("foo." + id + " changed from " + oldval + " to " + newval); return newv...
FireFox中替代onpropertychange事件的方法
鲁班学艺
06-21 1548
<br />FireFox中替代onpropertychange事件的方法：<br />1、IE中的onpropertychange事件，用于监听输入框的变化，像百度的智能提示;<br />2、FireFox中并不支持该事件，可以用input监听来替代，如下：<br /> <script type="text/javascript"> <br />function testdemo(){ <br />var element = document.getElementById("myname"); <br /
input框设置onInput事件只能输入数字，能兼容火狐IE9
weixin_33858249的博客
06-13 1697
使用onInput()事件 onInput()是 HTML5 的标准事件，对于检测 textarea, input:text, input:password 和 input:search 这几个元素通过用户界面发生的内容变化非常有用，在内容修改后立即被触发，不像 onchange 事件需要失去焦点才触发。 onInput() 事件在主流浏览器的兼容情况如下： 一个小例子：使用正则表达式，非数字就...
IE下onpropertychange与firefox下oninput用法
cool_rain_man的专栏
04-02 4065
 onpropertychange能够捕获每次输入值的变化。例如：对象的value值被改变时，onpropertychange能够捕获每次改变，而onchange需要执行某个事件才可以捕获。onpropertychange 不被firefox所支持，如果想在firefox下正常使用,需要用oninput属性,且需要用addEventListener来注册事件。例子：oninput测试 
总结oninput、onchange与onpropertychange事件的用法和区别
热门推荐
freshlover的专栏
09-04 10万+
前端页面开发的很多情况下都需要实时监听文本框输入，比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数。过去一般都使用onchange/onkeyup/onkeypress/onkeydown实现，但是这存在着一些不好的用户体验。比如onchange事件只在键盘或者鼠标操作改变对象属性，且失去焦点时触发，脚本触发无效；而onkeydown/onkeypress/onkeyup在处
"实时监听输入框值的JS技巧：onpropertychange与oninput
为了实现这一目的，我们可以利用JavaScript中的onpropertychange和oninput事件来监听输入框值的即时变化。这些事件可以帮助我们在用户输入时立即进行相应的处理，例如实时显示输入框已输入的字节数，或者根据输入的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值