goldrain

要讓網頁中的下拉列表支持可編輯，可不是件省心的事，上網搜索了下，也有一些解決方法，做起來總不夠簡便。我做了個簡單的實現，主要是通過給select添加選項的方式，達到可編輯的目的。演示網址 http://www.cmdgo.com/_ctrl/testruby/selecteditable,代碼如下：

    <select name="markcode" onChange="editable(this);">
    <option value="value1">選項一</option>
    <option value="">請輸入</option>
    </select>



<script language="javascript">
function editable(select1){
   if(select1.value == ""){
      var newvalue = prompt("請輸入","");
      if(newvalue){
         addSelected(select1,newvalue,newvalue);
      }
   }
}

function addSelected(fld1,value1,text1){
    if (document.all)    {
            var Opt = fld1.document.createElement("OPTION");
            Opt.text = text1;
            Opt.value = value1;
            fld1.options.add(Opt);
            Opt.selected = true;
    }else{
            var Opt = new Option(text1,value1,false,false);
            Opt.selected = true;
            fld1.options[fld1.options.length] = Opt;
    }
}
</script>

其中的function可以放到js文件中引用，這樣只要對select框添加很少的代碼就能支持可編輯了。支持IE和Firefox