如何从 jquery 的悬停函数中获取 <li> 的值？答案

【问题标题】：How to get the value of <li> from hover function of jquery?如何从 jquery 的悬停函数中获取 <li> 的值？
【发布时间】：2015-05-07 07:49:28
【问题描述】：

我的html内容如下，

<ul>
    <li class=folder>Main
      <ul>
         <li class=folder>1st fldr
            <ul>
                   <li> child1
                   <li> child2
            </ul
      </ul>

</ul>

现在我想获取folders(main , 1st fldr) 的值，因为我的jquery hover方法如下，

$('ul li.folder').hover(function () {
       alert($(this).text());
});

但我没有得到任何人可以帮助我的价值。

【问题讨论】：

注意：li 标签未关闭.. 重复 stackoverflow.com/questions/3442394/…
li 标签未关闭，ul 标签也
@Lucky 您的编辑对他的 HTML 代码进行了重大更改，这可能是他的问题的原因。应该向 OP 建议像这样的剧烈更改，但未经他的同意不得编辑。
@DarkAshelin 正如您所看到的，您回滚的修改后的编辑是无效的 html（它可能有效）并且
标签未关闭并且类元素缺少 " 和我进行了编辑以使其成为有效标记

【解决方案1】：

您需要从悬停元素中选择文本节点：

$('ul li.folder').hover(function () {
 alert($(this).contents().filter(function() {
   return this.nodeType === 3; //get text nodes
  }).text());
});

Working Demo

【讨论】：

没看懂，hover方法怎么写
这里的3是什么，为什么只有3？ , 这不是我唯一的 html 。它是一个动态的内容。它是动力树。所以我可能有很多文件夹和那么多孩子。
3 用于节点类型文本。如果内容是动态的，那么上面的事件应该可以工作。如果文件夹是动态添加的，那么您将不得不使用事件委托。

【解决方案2】：

    <ul>
        <li class=folder><span>Main</span>
        <ul>
            <li class=folder><span>1st fldr</span>
            <ul>
                <li> child1</li>
                <li> child2</li>
            </ul>
        </ul>

    </ul>


    $('ul li.folder span').mouseover(function () {
        alert($(this).text());
    });

http://jsfiddle.net/15v26hko/

【讨论】：

【解决方案3】：

这样使用

<ul>
    <li class=folder>Main
      <ul>
         <li class=folder><span>1st fldr</span>
            <ul>
                   <li> child1
                   <li> child2
            </ul
      </ul>

</ul>

并访问文件夹的值，如

$('ul li.folder').hover(function () {
       alert($(this).find('span').text());
});

【讨论】：

我不能把 span 这是动态生成的

【解决方案4】：

clone 根元素，然后找到它的children 和remove 它们。唯一剩下的就是当前元素。试试 -

$('ul li.folder').mouseenter(function () {
   var text = $(this).clone().children().remove().end().text();
   alert(text);
});

Demo

【讨论】：

更新了答案。只是不得不改变事件。悬停触发两次。所以改为mouseneter。
你能看看我的实际问题吗，jsfiddle.net/raghavendram040/6327rbgL。你的解决方案对我来说有些问题。
我不知道在我的实际 jsp 中发生了什么。我的 jsp 太乱了。我不能在我的项目中使用任何这些解决方案。但一切都在 fiddel 中工作。
检查那里的html。很多缺失的标签。
@Raghu 修复那个 html。