个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
很抱歉没有输入我处理过的代码。这次我把我的疑惑说清楚了。我有一棵由嵌套的 ul 和 li 标签组成的树。树节点名称是从数据库中获取的。我需要根据我在文本框中输入的名称来过滤树。在显示过滤树项时，如果过滤项是父节点，则还应列出子节点(即使它们与 texbox 中输入的文本不匹配。) 我引用了这个链接:
Filter multiple <ul> lists with jQuery
此链接帮助我通过在文本框中输入名称来过滤出树节点。但它的子节点不可见。请帮助我。请在下面找到我的代码:
function func(){
alert("Onclick function parent node...");}
function func1(){
alert("Onclick function child node...");}<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('input[type="text"]').keyup(function(){
var filter = jQuery(this).val();
jQuery("ul li").each(function () {
if (jQuery(this).text().search(new RegExp(filter, "i")) < 0) {
jQuery(this).hide();
} else {
jQuery(this).show();
jQuery(this).children().show();
}
});
});
});
</script>
</head>
<body>
<input type="text" />
<ul class="mainlayer" id="category1">
<li class="layer1"><a href="#" onclick="func();">item1</a>
<ul>
<li class="layer2"><a href="#" onclick="func1();">hju11</a></li>
<li class="layer2"><a>kiu12</a></li>
</ul>
</li>
<li class="layer1"><a>item2</a></li>
<li class="layer1"><a> item3</a></li>
</ul>
</body>
</html>提前致谢。
最佳答案
尝试这样的事情:
function func(){
alert("Onclick function parent node...");}
function func1(){
alert("Onclick function child node...");}<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<style>
.hide{
display:none;
}
</style>
<script>
$(document).ready(function() {
$('input[type="text"]').keyup(function(){
var filter = jQuery(this).val();
jQuery(".menu ul > li").removeClass("hide");
jQuery(".menu ul > li").removeClass("show");
jQuery(".menu ul > li").each(function () {
if (jQuery(this).text().search(new RegExp(filter, "i")) < 0 && !jQuery(this).hasClass('show')) {
jQuery(this).addClass('hide');
} else {
jQuery(this).addClass('show');
jQuery(this).find(' ul > li').addClass('show');
}
});
});
});
</script>
</head>
<body>
<input type="text" />
<div class="menu">
<ul class="mainlayer" id="category1">
<li class="layer1"><a href="#" onclick="func();">item1</a>
<ul>
<li class="layer2"><a href="#" onclick="func1();">hju11</a></li>
<li class="layer2"><a>kiu12</a></li>
</ul>
</li>
<li class="layer1"><a>item2</a></li>
<li class="layer1"><a> item3</a></li>
</ul>
</div>
</body>
</html>更新
更新的代码片段，您可以根据需要更改 .menu 类
关于javascript - 过滤由嵌套 <ul> <li> 和子节点组成的 TreeView ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37389492/
25
4
0
我在一页上有两个 Kendo UI TreeViews。例如: var data1 = new kendo.data.HierarchicalDataSource({ data: [
使用 Vuetify 的 TreeView 组件时，我试图能够选择父级 没有 让它也选择所有的后代( child )。我尝试了可选、可激活等的各种组合……但似乎找不到合适的组合。 任何人都有实现这一预
在我的应用程序中，左侧有一个 TreeView，我根据 TreeView 中的选择更新右侧的 Pane 。一个非常直接的场景。当选择为空时，我会在 Pane 中显示一条类似“请进行选择”的消息，即我还
我有一个我自己无法解决的问题。请帮忙。 我有(有条件地): /** @mainpage A @subpage B */ /** @page B @subpage C */ /** @page C */
我制作了一个高度为 40 px 的自定义树单元。 这里的问题披露三角形没有垂直居中对齐。 这里是树单元的代码: public static class TestObjectCell extends A
我正在学习如何使用 kotlin 并已开始使用tornadoFX。我正在阅读该指南以尝试学习它，但是我无法弄清楚“具有不同类型的 TreeView”中的含义。似乎是说我应该使用星形投影，据我所知，当您
如何在 JavaFX 2 TreeView 中过滤节点？ 我有一个 TextField，我想根据 TextField 的内容过滤所有节点(例如节点标签)。 谢谢。 最佳答案 这是我编写的可重用的可过滤
我正在通过查询 sharepoint 用户配置文件构建一个 asp.net TreeView 。要选择的帐户名和根节点帐户名正在从查询字符串中读取。 我还需要为树配置可配置的扩展深度。 如果节点属于第
我使用的是 JavaFX 8，目前正在进行一些 GUI 开发。我的 TreeView 有点问题，我需要你的帮助。 您知道在 TreeView 中是否可以只选择标签而不是 TreeCell 的整个宽度吗
我有很多(分层的)数据显示在 TreeView 中(可能是大约 20K 项或更多，包括子项)。我的数据的特殊问题是 TreeView 中显示的每个对象都可以存在于许多 TreeView 项目中。我的意
有没有什么简单的方法可以让 Gtk.Treeview 在编辑时更新它的列？ 我基于 Gtk.ListStore 模型构建了 Treeview。我这样初始化单元格: Gtk.CellRendererTe
我开始使用 javafx。我有一个问题。我有一个树 View ，其中节点通过外部命令改变了他的位置，但它只是看不到树。我必须最小化父级并重新展开才能看到效果。 Altem 对该树 View 的任何建议
如何在 Kendo Treeview 中取消选择节点？ 我尝试从节点中删除类“k-state-selected”。它工作正常，但有没有直接的方法可以做到这一点。 最佳答案 现在有一种更好的方法可以取消
我有以下情况，我有一个带有许多嵌套子节点的父节点。只有父节点应该有一个复选框，我发现的唯一例子是只有子节点有一个复选框。这可以使用 Kendo 模板吗？ http://dojo.telerik.com
我正在尝试向 TreeView 数据项添加一些内联图标，但是 k-template 指令似乎没有呈现任何内容。 我基于在线文档在 http://demos.telerik.com/k
我有一个带有复选框和父节点和子节点的 Kendo Treeview 。 我需要将选中节点的完整层次结构复制到另一个 Treeview 中。 ex - 根节点、父节点和选中的子节点。 下面是我的代码，但
我需要在较大的滚动 Pane 中使用 JavaFX 2.2 TreeView 控件，该滚动 Pane 具有多个不属于 Treeview 的其他元素。问题是 TreeView 有它自己的内置滚动 Pan
当我通过单击 TreeView 节点右侧的加号来展开该节点时，该节点将被选中。我怎样才能避免这种情况？我希望能够在不更改所选节点的情况下展开节点(例如在 RegEdit.exe 中)，并且仅在单击节点
我正在尝试设置一个 Treeview 对象，设置节点，然后更新控件以使值具有适当的格式。现在我有以下代码，当我设置一个控件时，它可以工作，但不是来自变量的控件。如何从变量设置本地控件？ Private
如何将节点填充到作为另一个 treeview1 实例的 newtreeview1 中？添加到“newtreeview1”的节点应该在 treeview1 的第一个实例中可用？ 例如；如果 treevi
我是一名优秀的程序员,十分优秀！