javascript刪除select中的所有option程式碼分享

本文主要和大家介紹javascript  刪除select中的所有option的實例的相關資料,希望透過本文能幫助到大家實現這樣的功能，需要的朋友可以參考下，希望能幫助到大家。

javascript  刪除select中的所有option的實例

方法一：

function DeleteOptions() 
  { 
    var obj = document.getElementsByTagName("select")[0]; 
    var selectOptions = obj.options; 
    var optionLength = selectOptions.length; 
    for(var i=0;i <optionLength;i++) 
    { 
      obj.removeChild(selectOptions[0]); 
    } 
  }

方法二：那右邊的Select中的所有option移到左邊的Select) 

function MoveAllRightBtn(){ 
    var columnlength=$('queryColumn').length; 
    var TempText; 
    var TempValue; 
    for(var i=0;i<columnlength;i++){ 
      TempText=$(&#39;queryColumn&#39;).options[i].text; 
      TempValue=$(&#39;queryColumn&#39;).options[i].value; 
      $(&#39;queryColumn&#39;).remove(i); 
      $(&#39;SearchqqueryColumn&#39;).options.add(new Option(TempText,TempValue)); 
    } 
  }

 以上兩個方法都不夠好！因為它們一次性都冊除不了，因為刪除了一個它的$('queryColumn')在option的序號就變了！
都好的方法是：

$('SearchqqueryColumn').options.length = 0;

 或：

<script> 
function clearOption() 
{ 
  document.getElementById("testSelect").options.length = 0; 
} 
</script>

 (那右邊的Select中的所有option移到左邊的Select)實作如下：

function MoveAllRightBtn(){ 
    var columnlength=$('queryColumn').options.length; 
    var TempText; 
    var TempValue; 
    for(var i=0;i<columnlength;i++){ 
      TempText=$(&#39;queryColumn&#39;).options[i].text; 
      TempValue=$(&#39;queryColumn&#39;).options[i].value; 
      $(&#39;SearchqqueryColumn&#39;).options.add(new Option(TempText,TempValue)); 
    } 
    $(&#39;queryColumn&#39;).options.length = 0; 
  }

相關推薦：

jQuery動態新增刪除select項目

jQuery動態新增刪除select項目(實作程式碼)

js刪除select中重複項的實作程式碼_表單特效

以上是javascript刪除select中的所有option程式碼分享的詳細內容。更多資訊請關注PHP中文網其他相關文章！