循环 .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>

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

这就是我希望的结果：

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

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

Answer 1

您需要调用.text()jQuery 对象，并且由于this引用了该元素（请参阅jQuery 文档.each()），因此只需包装this即可$()在循环中创建当前元素的新 jQuery 对象。

例子：

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

.innerHTML这么说时，除非您出于其他原因需要 jQuery 对象，否则最好直接使用。

例子：

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