且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

从下拉列表中选择后,出现奇怪的IE11表单字段错误

更新时间:2022-10-14 20:21:14

我有一个与IE11相似的问题,原来是对.text SELECT选项元素的属性。我最终在这里找到了提示在$ ***
在动态更改选项时如何解决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 *** 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