今天是easyui的Tree框架的點擊展開時的異步加載和全部直接加載:
<script type="text/javascript">
$(function () {
$("#tt2").tree({//異步點擊展開Tree
url: 'GetTreeMenu.ashx'
});
$("#tt").tree({//Tree直接展開
url: 'GetTreeMenu.ashx',
onLoadSuccess: function(node,data) {//加載成功後調用事件
var tree = $(this);
if (data) {
$(data).each(function(index,d) {
if (this.state=='closed') {
tree.tree('expandAll');
}
});
}
}
});
});
</script>
<body>
<ul id="tt2"></ul>
<ul id="tt"></ul>
</body>每次點擊展開tree的節點的時候,向後臺傳遞的是tree的id,這樣我們就可以根據id查處他的子節點,首次加載的時候id為null,這樣我們做個判斷,直接加載根節點就好
其中在異步加載時,隻要數據庫設計清晰,json數據正確,實現起來十分簡單
數據庫設計圖例: