效果圖：
最近在做項目遇到。combo控件選擇后觸發事件的情況，用onSelect發現，沒法選擇空item
於是就想辦法解決：
第一種方案：第一行增加空字符串文本的item？試試，綁定數據源的時候，增加了一個項，text和value都是""，結果發現，下拉panel中很難看，沒有撐開到一定高度（可能跟span的innerHTML為空字符串有關，於是將text該為" "），這次倒是撐開了，結果：選中之后文本框的文本變成了" "，又不好對onClick事件進行修改（easyui封裝好的）
第二種方案：又看到有個onChange事件，試試這個。。。。combobox按backspace鍵的時候還真觸發了，可是發現，文本發生改變就立即觸發該事件，但是在此處我需要執行的是grid重新加載數據（從服務端加載），而且combotree的文本框無法修改內容。。又宣告失敗
實在沒辦法，去看combo的構造函數吧……，發現combo初始化的時候是增加了一個input（顯示文本的）一個span（顯示下拉圖標的）還有一個hidden（顯示選擇項的value的）
那么只需要在span前邊多增加一個span即可，給新增加的span增加點擊事件：
還是不能對easyui代碼進行修改，那只好重新寫一個方法對dom進行修改了：
View Code
1 jQueryClearCombo = function (Combo) {
2 var combo = Combo.data().combo.combo;
3 var showClear = Combo.combo("options").showClear;
4 if (!showClear) {
5 showClear = Combo.attr("showClear");
6 }
7 var clear = combo.find(".combo-clear");
8 var text = combo.find(".combo-text");
9 if (!clear.hasClass("combo-clear")) {
10 if (showClear != "0") {
11 $(text).after("<span><span class=\"combo-clear\"></span></span>");
12 clear = combo.find(".combo-clear");
13 var w=clear.outerWidth();
14 text.width(text.width() - w);
15 clear.bind("click.combo", function () {
16 var v = "";
17 if (Combo.hasClass("easyui-combotree")) {
18 v = Combo.combotree("getValue");
19 Combo.combotree("setValue", "");
20 }
21 else if (Combo.hasClass("easyui-combobox")) {
22 v = Combo.combobox("getValue");
23 Combo.combobox("setValue", "");
24 }
25 var onClear = Combo.combo("options").onClear;
26 if (typeof (onClear) == "function") {
27 onClear(v, Combo);
28 }
29 }).bind("mouseenter.combo", function (a, b, c, d, e) {
30 $(this).addClass("combo-clear-hover");
31 }).bind("mouseleave.combo", function () {
32 $(this).removeClass("combo-clear-hover");
33 });
34 }
35 }
36 else if (showClear == "0") {
37 var w = clear.outerWidth()
38 text.width(text.width() + w);
39 combo.find("span:has(.combo-clear)").remove();
40 }
41 }
調用的時候，設置showClear屬性為0 則不顯示清除按鈕，默認情況下是帶清除按鈕的
View Code
1 {
2 "onClear": function (v, e) {
3 errorMessage("點擊了清除按鈕,清除前值為:" + v);
4 },
5 "allowClick": function (node) {
6 return node.attributes.OrgType == "2";
7 }
8 }
如果需要監聽清除按鈕事件，構造combo的時候 設置一個onClear函數即可（第一個參數為刪除之前的舊值，可判斷舊值也為空的話，就表示值沒發生改變不需要執行ajax代碼；第二個為combo對象）
另外一個 combotree中，有些節點不可以單擊選則，傳遞一個allowClick函數即可，參數為combotree所點擊項的節點(node)
代碼如下：
View Code
1 QueryComboTree = function (ComboObject, params) {
2 if (params == null) {
3 params = {};
4 }
5 var allowClick = params.allowClick, ErrorCallBack = params.onLoadError;
6 var url = $(ComboObject).attr("url");
7 if (url == null || url == "") {
8 url = getRootAjax("HRService")
9 + '?ClassName=HRService.PublicFunc&MethodName=ComboTreeJson&DictCode='
10 + ComboObject.attr("Code");
11 }
12 if ($(ComboObject).attr("onlyClickLeaf") == "1") {
13 params.allowClick = function (n) {
14 return $("").tree("isLeaf", n.target);
15 }
16 }
17 $.extend(params, {
18 url: url,
19 onLoadSuccess: function (response, json) {
20 SuccessOperation(response, json, function () {
21 jQueryClearCombo(ComboObject);
22 var op = ComboObject.combotree("options")
23 if (typeof (op.allowClick) == "function") {
24 var objTree = ComboObject.data().combotree.tree.data();
25 var oldClick = objTree.tree.options.onClick;
26 objTree.tree.options.onClick = function (node) {
27 if (op.allowClick(node)) {
28 oldClick(node);
29 }
30 else {
31 return;
32 }
33 }
34 }
35 });
36 },
37 onLoadError: function (response) {
38 ErrorOperation(response, ErrorCallBack);
39 }
40 });
41 ComboObject.combotree(params);
42 }