JS操作select下拉框動態變動(建立/刪除/取得)_javascript技巧

1.動態建立select

複製程式碼 程式碼如下:

function create選擇>var mySelect = document.createElement_x("select");
mySelect.id = "mySelect";
document.body.appendChild(mySelect);
}

2 .新增選項option

複製程式碼 程式碼如下:

function 程式碼如下:


function 位址//根據id找出對象，
var obj=document.getElementByIdx_x('mySelect');
//新增一個選項
obj.add(new Option("文字","值"));
}

3.刪除所有選項option

複製程式碼

複製程式碼



複製程式碼

程式碼如下

function removeAll(){ var obj=document.getElementByIdx_x('mySelect'); obj.options.length=0; } obj.options.length=0; }

>4.刪除一個選項option

複製程式碼


程式碼如下:

functionaltion

var obj=document.getElementByIdx_x('mySelect'); //index,要刪除選項的序號，這裡取目前選取選項的序號var index=obj.selectedIndex; obj. options.remove(index); }

5.取得選項option的值

複製程式碼

複製程式碼複製程式碼

程式碼如下:


var obj=document.getElementByIdx_x('mySelect');
var index=obj.selectedIndex; //序號，取目前選取選項的序號 var val = obj.options[index].value;

6.取得選項option的文字複製程式碼

複製程式碼

複製程式碼

複製程式碼複製程式碼

複製程式碼



複製程式碼

複製程式碼複製碼> 程式碼如下: var obj=document.getElementByIdx_x('mySelect'); var index=obj.selectedIndex; //序號，取目前選取選項的序號var val = obj.options[index].text; 7.修改選項option 複製代碼 程式碼如下: var obj=document.getElementByIdx_x('mySelect'); var index=obj.selectedIndex; //序號，取目前選取選項的序號 var val = obj.options[index]=new Option("新文字","新值"); 8.刪除select 複製程式碼 程式碼如下: function removeSelect(){ var mySelect = document.getElementByIdx_x("mySelect") . parentNode.removeChild(mySelect); }