通過ajax方式動態新增select下拉選單的option選項

antzone發表於2017-03-18

本章節介紹一下如何通過ajax方式動態的新增select下拉選單的option選項,下面是一個相關的程式碼片段,分享一下,希望能夠給需要的朋友帶來參考的作用。

一.下面是要新增的json格式資料:

[JavaScript] 純文字檢視 複製程式碼
{result:[{"webName":"螞蟻部落"},{"target":"分享互助"},{"age":3}]}

二.封裝的獲取指定id屬性值物件的函式:

[JavaScript] 純文字檢視 複製程式碼
function $$(id){return document.getElementById(id);}

三.ajax獲取相關程式碼:

[JavaScript] 純文字檢視 複製程式碼
var dataObj={result:[{"webName":"螞蟻部落"},{"target":"分享互助"},{"age":3}]} 
function changelayer(id,oid){ 
  $$(id).length=1; 
  $.ajax({ 
    type:"POST",
    url:"getOption.jsp",
    data:"json",
    success:function(msg){
      var dataObj=eval("("+msg+")");
      $.each(dataObj.result,function(key,value){ 
        for (var one in value){ 
          $$(id).options.add(new Option(value[one],one));
        } 
      })
    } 
  })
}

相關文章