兼容Firefox和IE的onpropertychange事件oninput
原文 兼容Firefox和IE的onpropertychange事件oninput
onpropertychange能够捕获每次输入值的变化。例如:对象的value值被改变时,onpropertychange能够捕获每次改变,而onchange需要执行某个事件才可以捕获。
在文本框输入数据的时候,当键盘按下并放开的时候可以使用onkeyup来检测事件,onpropertychange能够捕获每次改变,而onchange需要执行某个事件才可以捕获。可是有的时候我们输入数据是采用粘贴的方式而不是键盘输入,这就需要实时检测文本框状态的改变。
onpropertychange 不被firefox所支持,如果想在firefox下正常使用,需要用oninput属性,且需要用addEventListener来注册事件。
<body>
<div>oninput测试</div>
<div id="testdiv"><input id='tx1' name="tx1" value="" /></div>
</body>
</html>
<script language="JavaScript">
<!--
function getOs(){//判断浏览器类型
var OsObject = "";
if(navigator.userAgent.indexOf("MSIE")>0) {
return "MSIE";
}
if(isFirefox=navigator.userAgent.indexOf("Firefox")>0){
return "Firefox";
}
if(isSafari=navigator.userAgent.indexOf("Safari")>0) {
return "Safari";
}
if(isCamino=navigator.userAgent.indexOf("Camino")>0){
return "Camino";
}
if(isMozilla=navigator.userAgent.indexOf("Gecko/")>0){
return "Gecko";
}
}
if(navigator.userAgent.indexOf("MSIE")>0){
document.getElementById('tx1').attachEvent("onpropertychange",txChange);
}else if(navigator.userAgent.indexOf("Firefox")>0){
document.getElementById('tx1').addEventListener("input",txChange2,false);
}
function txChange(){
alert("testie");
}
function txChange2(){
alert("testfirefox");
}
</script>
以上就是兼容Firefox的onpropertychange事件方法。
兼容Firefox和IE的onpropertychange事件oninput的更多相关文章
- 关于onpropertychange与oninput的兼容问题
关于onpropertychange与oninput的用法,网上一大堆,但还是有不兼容的时候,比如说,我想计下,一个input的值改变了多少次,如果写成兼容写法就为 <!doctype html ...
- 总结oninput、onchange与onpropertychange事件的用法和区别
前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过去一般都使用onchange/onkeyup/onkeypress/onke ...
- 同时绑定onpropertychange 和 oninput 事件,实时检测 input、textarea输入改变事件,支持低版本IE,支持复制粘贴
实时检测 input.textarea输入改变事件,支持低版本IE,支持复制粘贴 检测input.textarea输入改变事件有以下几种: 1.onkeyup/onkeydown 捕获用户键盘输入事件 ...
- 总结oninput、onchange与onpropertychange事件的用法和区别,onchange
前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过去一般都使用onchange/onkeyup/onkeypress/onke ...
- 总结oninput、onchange与onpropertychange事件的用法和区别 书写搜索的神奇代码
总结oninput.onchange与onpropertychange事件的用法和区别 最近手机开发一个模糊搜索的功能组建,在网上就找到这篇文章! 前端页面开发的很多情况下都需要实时监听文本框输入,比 ...
- 实时监听文本框输入 oninput、onchange与onpropertychange事件的用法和区别
前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过去一般都使用onchange/onkeyup/onkeypress/onke ...
- 总结oninput、onchange与onpropertychange事件的使用方法和差别
onchange事件仅仅在键盘或者鼠标操作改变对象属性,且失去焦点时触发,脚本触发无效:而onkeydown/onkeypress/onkeyup在处理复制.粘贴.拖拽.长按键(按住键盘不放)等细节上 ...
- 【转】总结oninput、onchange与onpropertychange事件的用法和区别
经本人测试在chrome下的从历史记录中选取值的时候也户触发input事件 前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过 ...
- oninput、onchange与onpropertychange事件的区别, 与input输入框实时检测
这几天项目着急,同时也学到好多以前没有接触过的知识.oninput.onchange与onpropertychange事件的区别, 与input输入框实时检测 onchange事件只在键盘或者鼠标操作 ...
随机推荐
- 编程算法 - 分割数 代码(C)
分割数 代码(C) 本文地址: http://blog.csdn.net/caroline_wendy 题目: 有n个无差别的物品, 将它们划分成不超过m组, 求出划分方法数模M的余数. 比如: n= ...
- c# 操作 MongoDB 的 第三方类库 MongoRepository
https://github.com/RobThree/MongoRepository 文档 https://github.com/RobThree/MongoRepository/wiki/Docu ...
- CentOS在安装配置 Ngnix_tomcat_PHP_Mysql
安装Nginx yum install nginx 假设显示找不到 nginx包,新建一个文件/etc/yum.repos.d/nginx.repo,内容: [nginx] name=nginx re ...
- [改变自己wordpress.2]给wordpress加上简单debug sql调试.
或者说,同事. 需要帮她打印出来sql 调试输出到页面sql 在这里,我们使用插件或一个的方式来启动配置文件wordpress的debug 在插件文件夹 wordpress/wp-content/pl ...
- Swift和C#的基本语法对比
Recently, Apple announced and released a beta version of the new Swift programming language for buil ...
- bitnami redmine 安装插件
https://wiki.bitnami.com/Applications/BitNami_Redmine_Stack#How_to_install_a_plugin_on_Redmine.3f 版权 ...
- 两次fclose引发的血案
代码本来在Windows上开发的,功能基本完毕迁移到Linux上,结果一跑,乱象重重.这里只列出两个. 一崩溃: /mnt/diskc/db/app/bin/mysqld: double free ...
- rest服务器
一个轻量级rest服务器 RestServer直接发布数据库为json格式提供方法 RestSerRestServer直接发布数据库为json格式 支持MySQL,SqlServer,Oracle ...
- ORA-38760: This database instance failed to turn on flashback database 第三篇
ORA-38760: This database instance failed to turn on flashback database 第三篇 第一篇 第二篇 问题现象: 在数据库a ...
- Linux进程管理(-)
一.进程的类型 能够将执行在Linux系统中的进程分为三种不同的类型: 交互进程:由一个Shell启动的进程.交互进程既能够在前台执行,也能够在后台 执行. 批处理进程:不与特定的终端相关联,提交 ...