图省事经常用UpdatePanel与处理ajax,最近发现在IE9的某些版本下会出现脚本错误,而且都是在UpdatePanel内有DropDownList控件的情况下才出问题。

目前发现9.0.8112.16421版都有此问题,9.0.8080.16413版部分机器有此问题。

调试了一下脚本,发现问题出在DropDownList控件无法重建,因为回传的表单中此控件的value为空。我们知道DropDownList控件表现到客户端HTML中就是标准的select标签,它的value就是当前选中option的value,进而跟踪发现DOM中所有option元素的value属性都为undefined,但是其attributes集合中记录的value却是有值的,比较奇怪,这个问题在其它浏览器中包括IE9之前的浏览器中都不存在。

解决思路是替IE9把这些option的value都赋上值,代码也比较简单,页面加载的时候修正一下就可以了:

   
   
   
   
  1. function fixDropdown() { 
  2.     var options = document.getElementsByTagName("option"), i = 0; 
  3.     for (; i < options.length; ++i) {  //注意不能用 for(var i in options) 的写法 
  4.         options[i].value = options[i].attributes["value"].nodeValue; 
  5.     } 

以上代码是用原生javascript写的,换jquery会更简洁:

   
   
   
   
  1. function fixDropdown() { 
  2.     $("option").each(function(){ 
  3.         $(this).val($(this).attr("value") || $(this).context.attributes["value"].nodeValue); 
  4.     });