jquery - jQuery插入多个div

Question

问题： jQuery 将<li>-element 插入到两个 div 中，但它应该只将其插入到第一个列表中。

HTML结构

<div id="participantsList1">
    <div class="inputList"></div>
</div>

<div id="participantsList2">
    <div class="inputList"></div>
</div>

jQuery：

this._itemList = $("#participantsList1");
 $('<li class="badge">' + WCF.String.escapeHTML(data.label) + ' <span class="icon icon-remove pointer"></span></li>').insertBefore(".inputList", this._itemList);

编辑：participantsList1不是静态值..

Answer 1

您可以使用:eq集合中的索引访问元素。eq 是基于零的索引，以访问您需要传递零的第一个元素：eq。

this._itemList = $("#participantsList1:eq(0)");

Answer 2

您可以更具体：

[...].insertBefore("#participantsList1 .inputList", this._itemList);

Answer 3

那是因为 your$('<li class="badge">'指的是任何 li带有class = badge.

您可以使用parent > child选择器：http ://api.jquery.com/child-selector/

.insertBefore("#participantsList1 > inputList").

完整示例：

$('<li class="badge">' + WCF.String.escapeHTML(data.label) + ' <span class="icon icon-remove pointer"></span></li>').insertBefore("#participantsList1 > .inputList", this._itemList);

Answer 4

我自己解决了这个问题：

$('<li class="badge">' + WCF.String.escapeHTML(data.label) + ' <span class="icon icon-remove pointer"></span></li>').insertBefore($(".inputList", this._itemList));

我必须将一个 jQuery 对象传递给insertBefore()（缺少$(...)）