以下是使用
zTree实现一级
节点后面增加一个按钮靠右显示的完整代码：
HTML代码：
```html
<ul id="tree" class="
ztree"></ul>
```
CSS样式：
```css
.
ztree li button {
float: right;
margin-right: 10px;
}
```
JavaScript代码：
```
javascript
var zNodes = [
{ id:1, pId:0, name:"
节点1", open:true },
{ id:11, pId:1, name:"
节点1-1" },
{ id:12, pId:1, name:"
节点1-2" },
{ id:13, pId:1, name:"
节点1-3" },
{ id:2, pId:0, name:"
节点2", open:true },
{ id:21, pId:2, name:"
节点2-1" },
{ id:22, pId:2, name:"
节点2-2" },
{ id:23, pId:2, name:"
节点2-3" },
{ id:3, pId:0, name:"
节点3", open:true },
{ id:31, pId:3, name:"
节点3-1" },
{ id:32, pId:3, name:"
节点3-2" },
{ id:33, pId:3, name:"
节点3-3" }
];
var setting = {
view: {
addDiyDom: function(treeId, treeNode) {
if (treeNode.level === 1) {
var button = document.createElement('button');
button.innerHTML = '操作';
button.onclick = function() {
alert('点击了操作按钮');
};
var aObj = $("#" + treeNode.tId + "_a");
aObj.append(button);
}
}
},
data: {
simpleData: {
enable: true
}
}
};
$(document).ready(function(){
$.fn.
zTree.init($("#tree"), setting, zNodes);
});
```
在上面的代码中，我们通过
zTree的`addDiyDom`
回调函数，在
渲染节点时，判断当前
节点的层级是否为1（即一级
节点），如果是，则创建一个按钮元素，并绑定点击
事件，最后将按钮元素添加到
节点的`<a>`标签中。CSS样式中，我们将按钮元素的`float`属性设置为`right`，使其靠右显示。
391
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
