easyui利用combobox實現下拉框簡單介紹

本章節通過程式碼片段介紹一下如何利用easyui的combobox實現下拉框效果。

不會給出完整的程式碼，需要的朋友可以做一下參考。

實現方式一:

[HTML] 純文字檢視 複製程式碼
<input id="cc" class="easyui-combobox" name="name" data-options="valueField:'value',textField:'text',data:[{'value':'1','text':'java'},{'value':'2','text':'C#'}]"/>

上面的程式碼採用的是在Input框中顯示。

實現方式二:

[HTML] 純文字檢視 複製程式碼
<th data-options="field:'lb',editor:{type:'combobox',options:{data:[{'value':'1','text':'java'},{'value':'2','text':'C#'}],valueField:'value',textField:'text'}}">類別</th>

上面的程式碼採用的是在list列表中顯示。

實現方式三:

[HTML] 純文字檢視 複製程式碼
<th field="level" editor="{   
  type:'combobox',    
  options:{  
    data:[    
      {'value':'1','text':'java'},  
      {'value':'2','text':'C#'}  
    ],  
    valueField:'id',    
    textField:'text'
  }
}">    
類別</th>