樹形控件節點勾選狀態設置指南

問題描述

需要以程式碼方式將樹形控件的某個節點設置為勾選狀態。提問者提供了截圖，但未說明具體使用的樹控件庫（如 zTree、jQuery Tree、Bootstrap Treeview 等）。

通用解決思路

1. 確認樹控件類型與 API

不同庫的 API 差異極大，必須先確認 treeObj 的實際類型。常見庫對應方法：

• zTree：treeObj.checkNode(node, true, false);
• jQuery Tree：$('#tree').tree('check', node.target);
• Bootstrap Treeview：$('#tree').treeview('checkNode', [nodeId, { silent: true }]);

2. 根據節點 ID 或資料查找節點物件

// zTree 範例
var node = treeObj.getNodeByParam("id", targetId);
if (node) {
    treeObj.checkNode(node, true, false); // 勾選，不觸發回調
}

3. 注意勾選聯動邏輯

若樹配置了父子節點勾選聯動（chkStyle: "checkbox", chkboxType: { "Y": "ps", "N": "ps" }），勾選父節點會自動勾選子節點，反之亦然。設置時需考慮是否觸發聯動，參數 checkTypeFlag 控制。

圖片參考

參考資源

zTree 官方文檔：zTree 節點勾選操作詳解

最佳實踐

• 初始化樹時保存 treeObj 實例供後續操作。
• 封裝通用的 checkNodeById(id, checked) 方法，屏蔽庫差異。
• 操作前判斷節點是否存在，避免報錯。