問題描述

      對於select控制元件 1 2 3，我們可以通過它的options.add(new Option(v,t))的方法動態的插入一個option選項，但是新增的option的位置只能在最後，卻不能插入到指定的任意位置。

解決方法
      既然select的options屬性提供的方法無法實現上面的需求，那麼只好找辦法了。我們知道html控制元件都有一個insertBefore的方法，用以在指定位置插入子控制元件，這個方法也許可以使用，不妨測試一下，呵呵，真的可以。不過對於IE和firefox，還是有細節的差別。

瀏覽器相容

    對於FireFox，我們可以直接使用 selectCtl.insertBefore(new Option('value', 'text'), selectCtl.options[i]);這樣的簡單的形式在制定位置插入option，但是IE好像不行，需要使用下面的形式才可以 

               var option = document.createElement("option");

                option.value = 'value';

                option.innerText = 'text';

                selectCtl.insertBefore(option, selectCtl.options[i]);

完整程式碼(firefox3.01,IE7測試通過)

 function addAt(selectCtl,optionValue,optionText,position)

{

   var userAgent = window.navigator.userAgent;

   if (userAgent.indexOf("MSIE") > 0) {
                var option = document.createElement("option");
                option.value = optionValue;
                option.innerText = optionText;
                selectCtl.insertBefore(option, selectCtl.options[position]);
            }
            else
                selectCtl.insertBefore(new Option(optionValue, optionText), selectCtl.options[position]);

}

更好的方法

   上面使用增加一個新的javascript函式來解決問題， 我們還可以通過javascript中的prototype屬性來完成，這樣就可以給select控制元件增加一個新的擴充套件方法addOptionAt，使用 selectCtl.addOptionAt(new Option('v','t'),position)這種簡潔的方式來程式設計了，我還沒有寫，所以不能給出程式碼了。