javascript刪除或者新增option選項例項程式碼

select下拉選單的作用這裡就不多介紹了，儘管很多時候由於美觀度不夠需模擬實現，但是一般情況下還是能夠滿足基本需求的，下面就介紹一下如何使用javascript操作select下拉選單。

一.動態建立select下拉選單:

[JavaScript] 純文字檢視 複製程式碼
function createSelect() { 
  var mySelect=document.createElement("select"); 
  mySelect.id="mySelect"; 
  document.body.appendChild(mySelect); 
}

以上函式可以建立一個select下拉選單物件，id屬性值為mySelect，並將其新增到body中。

二.新增option選項:

[JavaScript] 純文字檢視 複製程式碼
function addOption() { 
  var obj=document.getElementById('mySelect');
  //這個只能在IE中有效 
  obj.add(new Option("文字","值")); 
  //相容IE與firefox 
  obj.options.add(new Option("text","value")); 
}

為select下拉選單新增一個option選項。

三.刪除選中的option項:

[JavaScript] 純文字檢視 複製程式碼
function removeOne() 
{ 
  var obj=document.getElementById('mySelect'); 
  //index,要刪除選項的序號，這裡取當前選中選項的序號 
  var index=obj.selectedIndex; 
  obj.options.remove(index); 
}

以上程式碼可以刪除選中的option選項。

這裡就不多介紹了，具體可以參閱javascript動態操作select下拉選單一章節。