在IE中不触发更改

OnChange not firing in IE

本文关键字:IE      更新时间:2023-09-26

我希望为 DIV 中表单元素的所有更改触发 Onchange 事件

这是代码片段

<html>
<body>
<div id="container">
    <input type="checkbox"/>
    <input type="checkbox"/>
    <input type="text"/>
    <input type="text"/>
</div>
<script>
di = document.getElementById("container");
di.onchange = function(a){
alert("On Change Called");
}
di.onclick = function(a){
 alert("On Click Called");
}
</script>
</body>
</html>

当焦点从任何表单元素丢失到表单的新元素时,当某些内容更新时(例如:输入框已更新),将触发该事件

上面的代码适用于所有浏览器,但不适用于IE,任何方法都是IE

实际上,IE,尤其是IE7/8不太支持onchange事件。我建议您使用onclick事件。

根据

MSDN onchange事件不会在 IE 中冒泡。

避免在 jquery for IE 的 .change() 函数之前使用 .focus() 或 .select(),那么它可以正常工作,我在我的网站中使用它。

谢谢

我在Edge中遇到了同样的问题,并使用事件侦听器修复了它。

我的代码看起来像这样:

.HTML:

<input type="text" id="my_id" name="my_name" placeholder="my_placeholder" onchange="my_function(this.value.trim())" autofocus>

然后我把它改成:

.HTML:

<input type="text" id="my_id" name="my_name" placeholder="my_placeholder" autofocus>

.JS:

document.getElementById("my_id").addEventListener("change", function() {
    my_function(this.value.trim())
});

大多数Web开发人员都必须面对这个问题。是的,旧版本的IE有时不会触发onChange事件并将其替换为onClick工作。

但最新的 IE 11 不会预料到这一点。 我在我的案例中发现的是onChange事件在某处发生冲突时调用的函数名称。我只是将其更改为其他名称,该名称在整个上下文中听起来应该是独一无二的,然后它起作用了。

结论:IE 11在发现一些相似的名字时感到困惑 在与onchange目标功能匹配的系统内(甚至 我猜的文件名),而其他浏览器是智能的 足够。

我创建此代码是为了触发未由Interenet Explorer触发的onchange事件。

与 asp.net 文本框一起使用

<!-- LOCAL SCRIPT -->
<script type="text/javascript">
$(document).ready(function () {
  // CTRL - fix explorer bug for OnChange not triggered. Converted to OnBlur + test
  if (navigator.appName == 'Microsoft Internet Explorer')
  {
    var tempControl = $("#<%= textboxNAME.ClientID %>");
    var tempATTRIBUTE = "data-lastvalue";
    // GET - save current value inside attribute
    tempControl.attr(tempATTRIBUTE, tempControl.val());
    // BIND - onblur event
    $("#<%= textboxNAME.ClientID %>").blur(function () {
        var tempPrevValue = tempControl.attr(tempATTRIBUTE);
        // CTRL - is there a difference of value (onchange)
        if (tempControl.val() != tempPrevValue) {
            // SET - trigger change js binded to textbox
            $(this).change();
        }
        });
  }

});

实际上 Onchange 在 IE 中效果不佳。这是我在使用Javascript时所做的。您可以相应地复制它。

  1. 在 HTML 中添加 ondrop 事件以调用现在正在调用的函数,而不是 onchange。
  2. 在 js 文件中添加以下代码

    document.getElementById('--your selector--').ondragover = handle;
    function handle(evt)
    {
         evt.stopPropagation();
         evt.preventDefault();
         evt.dataTransfer.dropEffect = 'copy'
    }
    
  3. ondragover 将被上面的代码设为 false,然后 ondrop 将在所有浏览器上触发并调用所需的函数

相关文章:
  • 没有找到相关文章