`
昔日舞曲
  • 浏览: 58081 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Firefox和IE 的onchange,onpPropertyChange事件的区别

阅读更多

参考文章:

http://www.cnblogs.com/dingxue/archive/2007/03/23/684807.html

http://www.stud.uni-karlsruhe.de/~uu5i/blog/index.php?aid=737

原因:

FF里面,onchange事件马上发生。 IE里面,onchange事件在失去焦点后发生。

例证:

<html>

<head>

    <title>IE对input列素onchange事件的支持BUG测试</title>

    <script type="text/javascript">

        function showTip(){

            document.getElementById("Tip").style.display="inline";

        }

    </script>

</head>

<body>

    <div style="width:400px;">

        <input type="text" name="txt1" onchange="showTip()">

        <span id="Tip" style="display:none;">这里是提示信息,在页面加载时时是隐藏的</span><br>

        这行字用来显示到页面上<br>

        <input type="text" name="txt2">

    </div>

</body>

</html>

运行上面的代码,在第一个文本框里随便输出些什么,然后用鼠标点击第二个文本框,看光标的位置,按下Backspace键试试,问题出现!

然后重新打开页面,焦点移到第一个文本框里,不输入任何东西然后点击第二个文本框,问题没有出现。

按一般理解上的意义来说,onchange应该是在文本框里内容有变化时发现,就是每输入一个字符都应该触发一次,然而结果却表明IE是在输入时并没有触发,而是在input失去焦点时触发了onchange事件,“基本等同于”onblur事件,但onblur事件却没有这个BUG

解决办法:

IE有一个onpropertychange事件,和标准的onchange事件一样触发,所以通常的做法都是同时绑定着两个事件

改为:

<input type="text" name="txt1" onpropertychange="showTip()">

分享到:
评论

相关推荐

    兼容Firefox和IE的onpropertychange事件oninput

    这些事件在不同浏览器中有着不同的表现和兼容性,尤其是在Internet Explorer (IE) 和 Firefox之间。 `onpropertychange` 是IE浏览器特有的事件,当对象的任何可枚举属性发生变化时,它都会触发。特别是在处理表单...

    ckeditor onchange 事件插件

    以下是一些关于如何使用 "onchange" 事件插件的详细步骤和知识点: 1. **安装插件**:首先,你需要确保已经安装了 "onchange" 插件。如果 CKEditor 的默认安装包中没有包含此插件,你可以从 CKEditor 的官方网站...

    easyui-textbox和easyui-combobox的onchange事件响应实例

    在这个实例中,我们将深入探讨 EasyUI 中的两个重要组件:`easyui-textbox` 和 `easyui-combobox`,以及它们的 `onchange` 事件响应。 `easyui-textbox` 是一个基础输入框组件,它扩展了原生 HTML 的 `input` 元素...

    javascript在IE和Firefox中兼容性问题

    例如,`onchange`和`onblur`事件在IE和Firefox中的触发时间可能不同,开发者需要考虑到这些差异,以确保事件处理的一致性。 7. **body测试.html** `body`元素在不同浏览器中的加载时机和处理方式也可能有区别。在...

    odoo定时执行onchange事件模块

    安装该模块后,对于有写onchange方法的字段,可以设置定时执行时间间隔。

    select 选择同一值触发onchange事件

    web前端小问题,select 选择事件,当选择select同一值触发onchange事件

    js触发onchange事件的方法说明

    js中onchange事件是在客户端改变输入控件的值,比如一...object.fireEvent()方法,使用方法如 object.fireEvent(‘onchange’),即可触发控件的onchange事件。 同理,js中使用fireEvent方法还可以触发其他的空间事件。

    easy-ui onchange/easy-ui添加onchange

    总之,Easy-UI的`onchange`事件和获取Combobox选中值的方法是实现动态交互的关键。通过对这些知识点的掌握,你可以创建出更加灵活和响应式的用户界面。请确保在实际应用中结合具体业务需求,灵活运用这些技术,以...

    使用Delphi的OnChange事件,Timagelist组件..rar

    总的来说,Delphi的Timagelist组件结合onChange事件,为开发者提供了强大的图像管理和响应变化的能力,使得在处理图形界面时更加灵活和高效。无论你是创建桌面应用还是进行游戏开发,掌握Timagelist组件和onChange...

    同时兼容IE和FireFox的事件处理event代码--添加文件上传例子

    "同时兼容IE和FireFox的事件处理event代码--添加文件上传例子"这个主题聚焦于解决浏览器之间的差异,尤其是针对老版本的Internet Explorer(IE)和Firefox。在这些早期浏览器中,事件处理的实现方式有所不同,导致...

    jsp中select的onchange事件用法实例.docx

    ### JSP中Select的onchange事件用法实例详解 #### 一、引言 在Web开发中,`onchange`事件是一种常用的JavaScript事件,用于在用户更改表单元素(如`&lt;select&gt;`下拉列表)时触发特定的操作。在JSP(JavaServer Pages...

    javascript的onchange事件与jQuery的change()方法比较

    改变一下思路变成键盘按键事件,如下: ”txtName” runat=”server” xss=removed&gt;&lt;/asp&gt; 这里有一点毛病是,你复制粘贴的内容,无法触发这个事件。下面是相关的一些代码: 代码如下: function fNameChange(){ if($...

    onchange_1.8.zip

    然而,由于浏览器的兼容性问题,特别是IE(Internet Explorer)浏览器,`onchange`事件在某些情况下可能不会如预期那样工作。 标题"onchange_1.8.zip"暗示这是一个针对CKEditor的补丁或插件,它的主要目标是解决在...

    js 触发select onchange事件代码

    在前端开发中,select元素和text文本输入框元素经常需要处理用户的交互行为,其中onchange事件是一个非常重要的事件。onchange事件会在元素的内容改变并且失去焦点后触发。但在JavaScript中,直接给select或text赋值...

    纯JavaScript实现获取onclick、onchange等事件的值

    select id=”city” onchange=”[removed]test();”&gt;&lt;/select&gt;中获取[removed]test();。 小菜想通过事件中的信息,确定下一级的菜单,但是这个貌似很简单的问题,却让小菜纠结了一番。  稍微懂点JQuery的...

    onchange,onpropertychange,oninput键盘输入和js赋值时区别

    在JavaScript中,`onchange`、`onpropertychange` 和 `oninput` 是与用户交互相关的事件,它们各自有特定的触发条件,特别是在处理表单元素的键盘输入和JavaScript动态赋值时。以下是对这三个事件的详细解释: 1. `...

    oninput,onpropertychange,onchange的用法和区别

    在 Web 开发中,了解 oninput、onpropertychange、onchange 三个事件的用法和区别非常重要,这三个事件都是用于检测用户输入的变化,但它们之间存在着一些关键的差异。 首先,让我们来了解 onchange 事件。当 ...

    关于onchange事件在IE和FF下的表现及解决方法

    本文将围绕onchange事件在微软的Internet Explorer(简称IE)和Mozilla Firefox(简称FF)浏览器中的表现差异进行讨论,并提供相应的解决方案。 首先,onchange事件是一个非常常用的事件,它在元素值发生改变并失去...

Global site tag (gtag.js) - Google Analytics