我正在开发一个文件树。用我现在的代码，我只能显示和隐藏树上的所有目录，我点击哪个节点并不重要。
我需要能够保持相同的类名，但只显示/隐藏我点击的元素。
请检查代码片段。
function init_php_file_tree() {
$(this).on('click', function() {
$(this).toggleClass('closed');
$('.pft-directory ul').toggle();
});
};
jQuery(init_php_file_tree);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<ul>
<li class="pft-directory">
<a class="closed" href="#">Parent directory </a>
<ul style="display: none;">
<li class="pft-file ext-pdf">File Name </li>
<li class="pft-file ext-doc">Another File Name </li>
</ul>
<ul style="display: none;">
<li class="pft-directory">Directory Name </li>
<li class="pft-directory">Another Directory Name </li>
</ul>
</li>
<!-- If you have more than 2 directories in the same level they all expand and collapse, no matter which one you click -->
<li class="pft-directory">
<a class="closed" href="#">Parent directory </a>
<ul style="display: none;">
<li class="pft-file ext-pdf">File Name </li>
<li class="pft-file ext-doc">Another File Name </li>
</ul>
<ul style="display: none;">
<li class="pft-directory">Directory Name </li>
<li class="pft-directory">Another Directory Name </li>
</ul>
</li>
</ul>
</body>
</html>
3条答案
按热度按时间dgenwo3n1#
您需要选择正确的元素
.pft-directory，并使用函数children显示/隐藏ul元素。x一个一个一个一个x一个一个二个x
scyqe7ek2#
你能稍微修改一下你的代码来定位像下面这样的特定元素吗？
bjp0bcyl3#
您可以像这样更改代码