如何使用 JQuery 在单击的 object 中检索具有特定 class 的 span 元素内的文本？

Question

我不太喜欢 JavaScript\jQuery，我对如何在实现菜单的 jQuery 脚本中处理以下情况有以下疑问，这里是 JSFiddle link查看完整的运行代码：

https://jsfiddle.net/AndreaNobili/s8wos4n2/

因此，正如您在之前的 JSFiddle 中看到的，我有以下情况。

在 HTML 代码中，我有菜单选项卡，这些选项卡由 <li> 选项卡实现，如下所示：

<li class="com__nav-item">
    <a href="" class="com__nav-link centered">
        <span class="blue-line animate scaleIn delay-3 menuVoiceTitle">FUNCTION 1</span>
        <span class="white-circle animate scaleIn delay-5"></span>
    </a>
</li>

因此，如您所见，实现菜单项的每个 <li> 选项卡都包含一个显示菜单项标题的 <span>（例如 FUNCTION 1在这个例子中）。

所有这些<span>都设置了menuVoiceTitleCSSclass.

好的，当用户单击菜单项时，它会执行 JavaScript switchTab() 函数，这里我有 p 变量：

var p = $(this).parent('li');

我认为这是被点击的 link 的 <li> 的引用（或类似的东西）。

所以现在我有了代表单击的菜单项的 <li> 元素的引用，现在我想检索具有 menuVoiceTitle [=51= 的 <span> 元素内的文本] class 在此 <li> 元素内。

如何使用 jQuery 正确实现此行为？

Answer 1

简单地说：

$('.com__nav-item').click(function(){
   var targettext = $(this).find('span.menuVoiceTitle').text();
   alert(targettext);
});

jsFiddle

Answer 2

var p = $(this).parent('li');

这一行 select parent li 表示当前 "li tag" 你现在点击了。

targetText = p.find('.menuVoiceTitle').html();

现在，在 "var p = $(this).parent('li');" 之后使用这一行，您将需要文本。

注：- find() 是一个 jquery 函数，它试图通过 select 或 (id, class, tag name) inside element.

如何使用 JQuery 在单击的 object 中检索具有特定 class 的 span 元素内的文本？

How can I retrieve the text inside a span element having a specific class that is inside a clicked object using JQuery?

html

javascript

jquery

jquery-events