Javascript OnChange 未在 IE 中触发
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10876152/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
OnChange not firing in IE
提问by Akash
I wish to fire a Onchange event for all the changes of Form elements within a DIV
我希望为 DIV 中表单元素的所有更改触发 Onchange 事件
Here's the snippet
这是片段
<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>
The event is fired, when a focus is lost from any of the form elements to a new element of the form, when some content is updated (eg: the input box is updated)
该事件被触发，当焦点从任何表单元素丢失到表单的新元素时，当某些内容更新时（例如：输入框被更新）
The above code works fine for all browsers' but not for IE, any way to do this is IE
上面的代码适用于所有浏览器，但不适用于 IE，任何方法都是 IE
回答by Cyanny
Actually, IE, especially IE7/8 doesn't support onchangeevent very well . I do recommend you use onclickevent.
实际上，IE，尤其是 IE7/8 并不能onchange很好地支持事件。我建议你使用onclick事件。
回答by Strelok
onchangeevent does not bubble in IEaccording to MSDN.
onchange根据 MSDN，事件不会在 IE 中冒泡。
回答by Julian
I had the same problem in Edge and fixed it using an EventListener.
我在 Edge 中遇到了同样的问题并使用 EventListener 修复了它。
My code looked like this:
我的代码如下所示：
HTML:
HTML：
<input type="text" id="my_id" name="my_name" placeholder="my_placeholder" onchange="my_function(this.value.trim())" autofocus>
Then I changed it to:
然后我把它改成了：
HTML:
HTML：
<input type="text" id="my_id" name="my_name" placeholder="my_placeholder" autofocus>
JS:
JS：
document.getElementById("my_id").addEventListener("change", function() {
my_function(this.value.trim())
});
回答by muhammadanish
Avoid using .focus()or .select()before .change()function of jqueryfor IE, then it works fine, im using it in my site.
避免在 IE的jquery 的.change()函数之前使用.focus()或.select()，然后它工作正常，我在我的站点中使用它。
Thanks
谢谢
回答by Amit Shah
Mostly all web developer must have faced this issue..
yeh the older version of IE sometimes not firing the onChangeevent and replacing it with onClickworks.
大多数 Web 开发人员都必须面临这个问题.. 是的，旧版本的 IE 有时不会触发onChange事件并用onClick作品替换它。
But this is not expected with latest IE 11. what I found in my case was the function name being called on onChangeevent was clashing somewhere. I just changed it to some other name which should sound like unique in the whole context, then it worked.
但这不是最新的 IE 11 所预期的。在我的案例中，我发现在onChange事件中调用的函数名称在某处发生冲突。我只是将它更改为在整个上下文中听起来应该是独一无二的其他名称，然后它就起作用了。
Conclusion: IE 11 getting confused when finds some similar names within the system matching with the
onchangetarget function (even the file names I guess), while the other browsers are intelligent enough.
结论：IE 11在系统中发现一些与
onchange目标函数匹配的相似名称（甚至是我猜测的文件名）时会感到困惑，而其他浏览器足够智能。
回答by Aausuman
Actually Onchange does not work very well in IE. Here is what I did while using Javascript. You can replicate it accordingly.
实际上 Onchange 在 IE 中运行得不是很好。这是我在使用 Javascript 时所做的。您可以相应地复制它。
- Add ondrop event in HTML to call the function being called now, instead of onchange.
Add the following code in your js file
document.getElementById('--your selector--').ondragover = handle; function handle(evt) { evt.stopPropagation(); evt.preventDefault(); evt.dataTransfer.dropEffect = 'copy' }The ondragover will be made false by above code, and then ondrop will fire on all browsers and call the required function
- 在 HTML 中添加 ondrop 事件来调用现在被调用的函数，而不是 onchange。
在你的js文件中添加以下代码
document.getElementById('--your selector--').ondragover = handle; function handle(evt) { evt.stopPropagation(); evt.preventDefault(); evt.dataTransfer.dropEffect = 'copy' }ondragover 将被上面的代码设为 false，然后 ondrop 将在所有浏览器上触发并调用所需的函数
回答by Roberto Mutti
I created this code to trigger the onchange event not triggered by Interenet Explorer.
我创建了这段代码来触发不是由 Internet Explorer 触发的 onchange 事件。
Used with an asp.net textbox
与 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();
}
});
}
});
