javascript - 循环 .find() 结果并收集 .text()

Question

我有以下代码:

jQuery

$("li").click(function(){
  $(this).toggleClass("selected");
  $(".selected").each(function(){
    $(".items").append(this.text() + ", ");
  });
});

html

<ul class='category'>
  <h4>Category</h4>
  <a href="#"><li class="selected">Link 1</li></a>
  <a href="#"><li>Link 2</li></a>
  <a href="#"><li>Link 3</li></a>
  <a href="#"><li class="selected">Link 4</li></a>
  <a href="#"><li class="selected">Link 5</li></a>
  <a href="#"><li>Link 6</li></a>
  <a href="#"><li>Link 7</li></a>
</ul>

<span class="items">Selected Items Appear Here</span>

我正在尝试在 $(".category") 的内容中搜索具有 .selected 类的标签，然后将结果附加到另一个 div。

这是我希望的结果:

<span class="items">Link 1, Link 4, Link 5</span>

但是，this.text() 似乎返回了未定义的错误。
关于我做错了什么有任何线索吗？

Answer 1

您需要在 jQuery 对象上调用 .text()，并且由于 this 引用该元素(请参阅 jQuery docs for .each() )，只需将 this 包装起来 在 $() 中创建循环中当前元素的新 jQuery 对象。

示例:

$(".items").append($(this).text() + ", ");

说到这里，您可能最好只使用 .innerHTML ，除非您出于其他原因需要 jQuery 对象。

示例:

$(".items").append(this.innerHTML + ", ");