JQ樹僅顯示父節點處於選中狀態的選定節點

Question

我只需要顯示選定的節點和父節點，並在單擊按鈕時隱藏其余節點。 當我單擊按鈕時，什么也沒有發生。

jsfiddle

http://jsfiddle.net/375emow0/

單擊按鈕后開始注釋的代碼
$（'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/