基於dhtmlxtree實現的下拉樹

下拉樹對象代碼：

function dhtmlXTreeCombo(id, name){

var _parent = document.getElementById(id);
var _combo = document.createElement("div");
_combo.setAttribute("id", "combo");
_combo.style.width = '150px';
_combo.style.height = '20px';
var _input = document.createElement("div");

_input.align = "right";

       

var _hidden = document.createElement("input");
_hidden.setAttribute("type", "hidden");
_hidden.setAttribute("name", name);
var _img = document.createElement("img");
//下拉框圖標
this.setImage = function(img){
_img.setAttribute("src", img);
}
_img.setAttribute("id", "img");  

var _content = document.createElement("div");
_content.setAttribute("id", "content");
_content.style.height = '20px';

_input.appendChild(_img);
_input.appendChild(_hidden);
_combo.appendChild(_content);
_combo.appendChild(_input);
_parent.appendChild(_combo);

var _tree = document.createElement("div");
_tree.setAttribute("id", "treebox"+id);
_tree.style.display = "none";
_tree.style.width = "150px";
_tree.style.height = "100px";
_tree.style.border = "1px solid Silver";
_parent.appendChild(_tree);
var tree=new dhtmlXTreeObject("treebox"+id,"100%","100%",0);
tree.setEscapingMode('UTF-8');
this.setIconsPath = function(path){
tree.setIconsPath(path);
tree.enableTextSigns(true);
}
this.loadTree = function(url){
tree.setXMLAutoLoading(url);
tree.loadXML(url);
}
tree.attachEvent("onClick", function(id){
_content.innerHTML = tree.getItemText(id);
_hidden.value = id;
_tree.style.display = 'none';
});

_img.onclick = function(){
if(_tree.style.display == 'none'){
_tree.style.display = 'block';
} else {
_tree.style.display = 'none';
}
}

}

實例化下拉樹代碼：

<div id="test" ></div>
<script>
var test = new dhtmlXTreeCombo("test", "testname");
test.setImage("<%=basePath%>image/combo_select_dhx_skyblue.gif");
test.setIconsPath("<%=basePath%>dhtmlx/imgs/csh_bluebooks/");
test.loadTree("<%=basePath%>menu/getChildMenu.action?id=7420");
</script>