jQuery Tree 插件提供了一種簡單的方法來處理節點的排序。以下是如何使用 jQuery Tree 插件對節點進行排序的步驟:
首先,確保您已經在您的項目中包含了 jQuery 和 jQuery Tree 插件。您可以從以下鏈接下載這些庫:
在您的 HTML 文件中創建一個用于承載樹結構的容器:
<div id="tree"></div>
$(document).ready(function() {
$("#tree").jstree({
"core": {
"data": [
{
"id": "node1",
"text": "Node 1",
"children": [
{ "id": "node1-1", "text": "Node 1.1" },
{ "id": "node1-2", "text": "Node 1.2" }
]
},
{
"id": "node2",
"text": "Node 2",
"children": [
{ "id": "node2-1", "text": "Node 2.1" }
]
}
]
}
});
});
sort
方法對節點進行排序。您可以在任何事件(例如按鈕點擊)上調用此方法。以下示例演示了如何根據節點的文本進行排序:function sortNodes() {
$("#tree").jstree(true).sort(function(a, b) {
return a.text.localeCompare(b.text);
});
}
<button onclick="sortNodes()">Sort Nodes</button>
現在,當您點擊 “Sort Nodes” 按鈕時,樹結構中的節點將根據其文本進行排序。您可以根據需要修改 sort
函數以按照其他屬性對節點進行排序。