要處理jQuery Tree中的節點展開事件,您可以使用expand
事件。下面是一個示例代碼,展示了如何為樹節點添加展開事件處理程序:
首先,確保您已經在HTML文件中包含了jQuery庫和jQuery Tree插件。例如:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery Tree Example</title>
<!-- 引入jQuery庫 -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<!-- 引入jQuery Tree插件 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-tree/1.0.0/jquery.tree.min.js"></script>
</head>
<body>
<ul id="tree">
<li>Node 1
<ul>
<li>Node 1.1</li>
<li>Node 1.2</li>
</ul>
</li>
<li>Node 2</li>
<li>Node 3
<ul>
<li>Node 3.1</li>
</ul>
</li>
</ul>
<script>
// 初始化樹
$("#tree").tree({
expand: function (event, data) {
console.log("Node expanded:", data.node.text);
}
});
</script>
</body>
</html>
在這個示例中,我們創建了一個包含3個節點的樹。我們在<script>
標簽中初始化樹,并使用expand
屬性定義一個事件處理程序。當節點展開時,事件處理程序會在控制臺中輸出展開的節點文本。
您可以根據需要修改事件處理程序,以便在節點展開時執行其他操作。