與下拉框有兩點不同，第一是外觀上下拉清單會同時顯示多個待選項，第二是下拉清單會經常遇到需要多選的情況。
之前貓哥自己也沒在EasyUI中遇到過使用下拉清單時，同時擷取多個選中項的功能，今天寫DEMO的時候，隻能感覺大約是$("#mydatalist").datalist("getSelectedRows");或者$("#mydatalist").datalist("getSelectedItems");然後試了半天沒試出來，然後去翻官方示例和教程，也沒找到，最後又去百度了半天，發現這個EasyUI的datalist還是挺冷門的，竟然沒找到…好尴尬啊。
最後靈機一動，其實下拉清單不就是列數是1的表格麼，果斷去找datagrid(表格)擷取多個選中行的方法，發現是var rows = $('#dg').datagrid('getSelections');，問題解決。(PS其實人家架構開發組對方法的設計還是挺為使用者着想的。隻是擷取一個選中項的方法getSelected中Selected應該是形容詞或者動詞過去式（過去分詞）吧，而Selections既然能加s表複數應該是名詞吧，隐隐約約不甚合适，應該用getSelectedOne和getSelectedAll區分，或者用getSelectItem和getSelectedItems區分更加适合開發者去猜)。
OK，示意圖奉上：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>下拉清單datalist示例</title>
<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css">
<script type="text/javascript" src="easyui/jquery.min.js"></script>
<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
</head>
<body>
<div class="easyui-panel" title="示例 簡單下拉清單" style="width:400px;padding:10px 10px;">
<div>使用easyui-datalist樣式即可，需要注意的是簡單下拉清單是依賴與ul标簽的,注意lines:'true'使單元格直接具有分割線，更加美觀</div>
<ul id="hobby" class="easyui-datalist" title="Basic DataList" data-options="lines:'true'" >
<li value="football">足球</li>
<li value="basketball">籃球</li>
</ul>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="getSelectedHobby()">擷取選中值</a>
</div>
<div class="easyui-panel" title="示例 可多選的下拉清單" style="width:400px;padding:10px 10px;">
<div>注意本示例資料直接來自json/hobby.json</div>
<div id="hobbys" class="easyui-datalist" title="請選擇興趣愛好(可多選)" style="width:400px;height:250px" data-options="
url: 'json/hobby.json',
method: 'get',
singleSelect:false">
</div>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="getSelectedHobbys()">擷取選中項</a>
</div>
<script type="text/javascript">
function getSelectedHobby(){
var value=$("#hobby").datalist("getSelected");
alert(value.text);
}
function getSelectedHobbys(){
var value=$("#hobbys").datalist("getSelections");
var result="你喜歡：";
for(var i=0;i<value.length;i++){
result+=value[i].text;
}
alert(result);
}
</script>
</body>
</html>
最後，需要注意的是，datalist關聯背景json檔案資料時，隻關聯text鍵，本次使用的hobby.json源碼如下。
[
{"text":"足球"},
{"text":"籃球"}
]
![json擷取資料的三種方式[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)