要实现只能选择最后一级节点,可以在前端通过 zTree 的设置来实现。具体步骤如下:
1. 在 zTree 的配置中,设置 `check.enable` 为 true,表示支持复选框选择。
2. 设置 `check.chkboxType` 为 `{"Y":"ps","N":"ps"}`,表示只能选择最后一级节点。
3. 在每个节点的配置中,设置 `nocheck` 为 true,表示该节点不显示复选框。
示例代码如下:
```javascript
var setting = {
check: {
enable: true,
chkboxType: {"Y":"ps","N":"ps"}
},
data: {
simpleData: {
enable: true
}
},
callback: {
beforeClick: function(treeId, treeNode) {
// 如果是最后一级节点,则可以点击选择
return treeNode.isParent ? false : true;
}
}
};
var zNodes = [
{id:1, pId:0, name:"父节点1", open:true},
{id:11, pId:1, name:"子节点1-1", nocheck:true},
{id:12, pId:1, name:"子节点1-2", nocheck:true},
{id:13, pId:1, name:"子节点1-3", nocheck:true},
{id:2, pId:0, name:"父节点2", open:true},
{id:21, pId:2, name:"子节点2-1", nocheck:true},
{id:22, pId:2, name:"子节点2-2", nocheck:true},
{id:23, pId:2, name:"子节点2-3", nocheck:true},
];
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
```
在上述代码中,我们设置了 `nocheck` 为 true 的节点表示不显示复选框,同时在 `beforeClick` 回调函数中判断当前节点是否为最后一级节点,如果是,则可以点击选择。最终实现了只能选择最后一级节点的效果。