Question

我只需要显示选定的节点和父节点，并在单击按钮时隐藏其余节点。当我单击按钮时，什么也没有发生。

jsfiddle

带有注释的代码点击按钮开始
$（'button [name =“ psychTree-selected”]'）。click（function（node）{

get the selected nodes
nodesSelected = $('#psychTree').tree('getSelectedNodes');

create an array for shown nodes
nodeIdsToStay = [];

walk through selected nodes
nodesSelected.forEach( function(node) {
var path = $('#psychTree').tree('getData');
path.forEach(function(n) {
if (nodeIdsToStay.indexOf(n)===-1) {
nodeIdsToStay.push(n);
}
})
})

hide the nodes not in the array
$('#psychTree').find('li').each( function(){
if ( nodeIdsToStay.indexOf(this.id) === -1 ) {
$(this).hide();
}
})
})

我知道如何隐藏选定的节点，但是显然未选定的节点没有可识别的类供我http://jsfiddle.net/tom1nkfr/搜索和隐藏

`$('button[name="psychTree-selected"]').click( function() {`
`$('#psychTree').find('.jqtree-selected').each( function(){`
`$(this).hide();`
`})`
`})`

Answer 1

我建议使用一种更简单的方法-看来您正在尝试查找所有选定的节点，将其推入array，然后遍历整个jsTree并隐藏任何节点不是您创建的array中的。相反，请利用jsTree已经应用于选定节点的CSS类，并隐藏所有不包含它的类。

简体JS：

$('button[name="psychTree-selected"]').click(function() {
  $('#psychTree li.jqtree_common').each(function(index,elem){
    if(!$(elem).hasClass('jqtree-folder') && !$(elem).hasClass('jqtree-selected')){
        $(elem).hide();
    }
  });
})

仍然会在您单击按钮时触发，但现在会遍历所有树节点并隐藏（1）未选中和（2）不是父/文件夹节点的任何树。

工作中的JSFiddle：http://jsfiddle.net/tbwjau5m/

JQ树仅显示父节点处于选中状态的选定节点

1 个答案: