为什么悬停样式不适用于jQuery Treeview的叶节点?

时间:2009-11-16 16:20:01

标签: javascript jquery css treeview

如果查看this page上的示例1,您会看到,当您将鼠标悬停在文件夹条目上时,文本会变为红色,但如果将鼠标悬停在叶条目上则不会。我希望leaf条目的样式与文件夹条目的工作方式相同。

树的每个分支都是无序列表。叶条目是列表项<li>。我已经尝试为列表项设置样式的悬停属性,并且已经为DOM的其他部分使用悬停样式,但它要么根本不起作用,要么它将设置树的整个分支的样式(文本为文件夹和所有叶子项变为红色)。

有没有办法让这个工作,所以它会改变我悬停在树上的任何单个项目的文本颜色,包括叶子节点?

2 个答案:

答案 0 :(得分:1)

我不确定这是否正是您所寻找的,但“文件”节点都包含在<span class="file"></span>中。您应该可以通过$('.file').hover()

定位它们

答案 1 :(得分:1)

我不确定我的脑袋是否完全缠绕在它周围,但是从查看jQuery树视图代码可以清楚地看出,作者正在以不同于文件节点的方式处理文件夹节点。

我通过将每个文件节点的文本包装在<a>标记中解决了这个问题,这将很好地满足我的目的,因为这些最终都应该是链接。这让我可以这样定型:

.treeview a:link { }
.treeview a:visited { }
.treeview a:hover { }

在某种程度上,这有点酷,因为它允许我根据需要将略微不同的悬停样式应用于文件节点和文件夹节点。