以下是我的代码:
var nodeData = ${jsonArray}; // my json data
$('#tree1')
.tree(
{
data : nodeData,
autoOpen : 1,
onCreateLi : function(node, $li) {
$li
.find('.jqtree-element')
.append(
'<a href="javascript:void(0);" class="delete" data-node-id="Test"><i class="ico ico-tool-delete"></i></a>');
}
});
$('#tree1').bind('tree.click', function(event) {
if (event.node) {
var node = event.node;
alert("edit");
}
$tree.on('click', '.Test', function(e) {
alert("delete");
});
});
我想在点击节点和删除图标时生成不同的事件。
目前当我点击节点和删除图标时都生成相同的事件。
帮帮我,上面的代码需要做哪些改动。
谢谢
最佳答案
首先,您尝试选择具有 class
Test 的元素,但此类不存在。
此外,删除图标位于 li
节点元素内,这就是您触发相同事件的原因。
尝试像这样附加删除 a
元素:
$('#tree1').tree({
data : nodeData,
autoOpen : 1,
onCreateLi : function(node, $li) {
$li.append(
'<a href="#" class="delete" data-node-id="Test"><i class="ico ico-tool-delete">Delete</i></a>');
}
});
检查 fiddle
编辑:
您可以在附加删除元素时将节点 ID 保存为数据 属性
。
然后,当您单击特定的删除元素时,通过 id 获取所需的节点:
var node = $tree.tree('getNodeById', $(this).data('parent-id'));
然后删除这个项目:
$tree.tree('removeNode', node);
关于javascript - 为 jqtree 中的选择节点和删除图标生成不同的事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43731533/