在Internet Explorer中交换选项框？

Question

我的客户问我（JavaScript客户端程序员）更改选项的顺序，以便他们公司的选项在页面加载时出现在选择框的顶部。

下面的代码在Firefox，但Internet Explorer 7中失败，当我试图交换两个选项：

function load{ 
     var shippingLocation = document.getElementById("location"); 
     var swap = null; 

     var initiallyFirstItem = shippingLocation.options[0].cloneNode(true); 

     var lastPos = null; 

     for(var i = 0; i < shippingLocation.length; i++) 
     { 
      if(shippingLocation.options[i].value == "XETEX") 
      { 
       swap = shippingLocation.options[i]; 
       lastPos = i; 
       break; 
      } 
     } 
     console.debug("sl: " + shippingLocation.options[0]); 
     console.debug("s: " + swap); 
     shippingLocation.options[0] = swap; 
     shippingLocation.options[lastPos] = initiallyFirstItem; 
     shippingLocation.selectedIndex = 0; 
    } 

我坐上从旁边倒数第三行错误：

shippingLocation.options[0] = swap; 

错误指出“对象不支持此属性或方法”。

什么是Internet Explorer的切换选项的牛肉？

Answer 1

嗯，我做了一些测试，我相信IE认为options数组是不可变的（以某种方式）。您可以编辑这些选项并将其移除，但不能将一个选项设置为另一个选项。

所以，当你这样做：

shippingLocation.options[0] = swap; 

IE抱怨，因为你想设置一个选项到另一个。

我会做这个：

> Removed due to excessive stupidity on 
> my part. :P 

这里有一个更好的办法：

<script type="text/javascript"> 
function swap(obj,i,j) { 
    sib=obj.options[i].nextSibling; 
    obj.insertBefore(obj.options[i],obj.options[j]); 
    obj.insertBefore(obj.options[j],sib); 
} 
</script> 

Answer 2

啊，我们走吧。比上面的代码更优雅。

function swapOptions(obj,i,j){ 
    var o = obj.options; 
    var i_selected = o[i].selected; 
    var j_selected = o[j].selected; 
    var temp = new Option(o[i].text, o[i].value, o[i].defaultSelected, o[i].selected); 
     var temp2= new Option(o[j].text, o[j].value, o[j].defaultSelected, o[j].selected); 
    o[i] = temp2;o[j] = temp;o[i].selected = j_selected;o[j].selected = i_selected; 
}