从下拉列表中选择后,出现奇怪的IE11表单字段错误 [英] Strange IE11 form fields bug after selecting from dropdown

查看:252
本文介绍了从下拉列表中选择后,出现奇怪的IE11表单字段错误的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

IE 11遇到一个重大bug(Windows 7上的最新版本11.0.9600.16521)。如果我在任何表单上打开选择下拉菜单,则页面上的所有其他表单域都会冻结。我可以通过调整窗口大小(导致重绘)来解冻它们。这似乎发生在任何形式的事情上。



重现:
打开IE 11.0.9600.16521
转至 http://www.wikipedia.org/
从语言下拉列表中选择任何语言



结果:
语言下拉列表不会在屏幕上更新
搜索框显示为冻结 - 即关注选择框并开始输入,但不显示文本。但是,如果您调整窗口大小,表单字段会更新并返回到正常工作状态(直到您与另一个select元素进行交互)。

我找不到太多内容谷歌对于这个问题,所以也许这只是我的设置特定的东西。只有听起来有点类似于我正在经历的是这样的: http://connect.microsoft.com/IE/feedback/details/806679/即-11桌面选择-的项目 - 从-A-下拉列表上-A-网页死因最片 - 崩溃。任何人都可以重现这一点?

解决方案

我有一个与IE11相似的问题,原来是对.text SELECT选项元素的属性。我最终在这里找到了提示在$ stackoverflow
在动态更改选项时如何解决IE选择问题



在我的情况中,我使用直接的JavaScript,并且有很多相互依赖的SELECT框想出一个通用的解决方案,所以我的解决方案是拦截( defineGetter )赋值给HTMLOptionElement的任何.text属性,并设置1 ms计时器来执行添加元素和删除元素,如标题为我有修补程序的引用帖子,我们必须添加和删除选项列表才能触发IE8中的渲染。注意到对IE8的引用,AFAIK IE在SELECT盒子中有几个问题,因为至少IE7,可能更早。

所以我添加到我的一个全局脚本中的代码是如下所示:

  try {var IE11; // IE10和IE11从窗口对象中删除了ActiveXObject,但它仍然可以实例化
IE11 = new ActiveXObject('MSXML2.DOMDocument.6.0');
IE11 = null;
if(typeof(HTMLOptionElement)!=undefined){
try {HTMLOptionElement.prototype .__ defineSetter __(
'text',
function(original){
返回函数(newValue){var sel;
original.call(this,newValue);
if(!(sel = this.parentElement).fixIE)sel.fixIE = window.setTimeout(_fixIE_(sel ),1);
}
}(HTMLOptionElement.prototype .__ lookupSetter __('text')));
} catch(e){};
}
} catch(e){}
}

// IE11再次打开SELECT盒子,修改任何选项.text属性冻结SELECT出现禁用
函数_fixIE_(selBox){
return _fixIE_;
函数_fixIE _(){var lc = selBox.options.length;
selBox.options.add(新选项('',''));
selBox.options.remove(lc);
selBox.fixIE = undefined;


$ / code $ / pre
$ b $ Phil $ / b $ b

I'm experiencing a major bug in IE 11 (latest version 11.0.9600.16521 on Windows 7). When on any form if I open a select dropdown all the other form fields on the page freeze. I can 'unfreeze' them by adjusting the Window size (causing a redraw). This seems to happen on any form what-so-ever.

To reproduce: Open IE 11.0.9600.16521 Go to http://www.wikipedia.org/ Select any language from the language dropdown

Result: language dropdown does not appear to get updated on the screen the search box appears to be frozen - i.e. focus on select box and start typing but no text appears. However if you adjust the window size the form fields are updated and go back to working as normal (until you interact with another select element)

I can't find much in Google for this issue so maybe it's just something specific to my settings. Only thing that sounds somewhat similar to what I'm experiencing is this: http://connect.microsoft.com/IE/feedback/details/806679/ie-11-desktop-selecting-an-item-from-a-drop-down-list-on-a-webpage-causes-the-tab-to-crash. Anyone else able to reproduce this?

解决方案

I had a similar issue with IE11 that turned out to be any modification to the .text property of an SELECT-option element. I eventually found the "hint" on stackoverflow here How to fix IE select issue when dynamically changing options.

In my case I use straight JavaScript, and with so many inter-dependent SELECT boxes had to come up with a generic solution, so my solution was to intercept (defineGetter) assignment to any .text property of an HTMLOptionElement, and set a 1 ms timer to perform an add element and remove element as in the referenced post that is titled "I have the fix. We have to add and remove options list to trigger the rendering in IE8." Notice the reference to IE8, AFAIK IE has had several issues with SELECT boxes since at least IE7, possibly earlier.

So the code I added to one of my global scripts is as follows:

try { var IE11;  // IE10 and IE11 removed ActiveXObject from the window object but it can still be instantiated
    IE11 = new ActiveXObject('MSXML2.DOMDocument.6.0');
    IE11 = null;
    if (typeof(HTMLOptionElement) != "undefined") {
        try { HTMLOptionElement.prototype.__defineSetter__(
                                          'text',
                                          function(original) {
                                              return function(newValue) { var sel;
                                                                       original.call(this, newValue);
                                                                       if (!(sel=this.parentElement).fixIE) sel.fixIE = window.setTimeout(_fixIE_(sel), 1);
                                                                   }
                                                               }(HTMLOptionElement.prototype.__lookupSetter__('text')));
            } catch(e) {};
        }
    } catch(e) {}
}

//  IE11 broke SELECT boxes again, modifying any options .text attribute "freezes" the SELECT so it appears disabled
function _fixIE_(selBox) {
    return _fixIE_;
    function _fixIE_(){ var lc = selBox.options.length;
        selBox.options.add(new Option('',''));
        selBox.options.remove(lc);
        selBox.fixIE = undefined;
    }
}

Phil

这篇关于从下拉列表中选择后,出现奇怪的IE11表单字段错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆