Question

<ul id="list">
<li><input name="int[]" type="checkbox" value="1" id="int1" />int1</li>
<li><input name="int[]" type="checkbox" value="2" id="int2" />int2</li>
<li><input name="int[]" type="checkbox" value="3" id="int3" />int3</li>
<li><input name="int[]" type="checkbox" value="4" id="int4" />int4</li>
</ul>

此

$("#list").append('<li><input name="int[]" type="checkbox" value="55" id="int55" />int55</li>');

请：

<ul id="list">
<li><input name="int[]" type="checkbox" value="1" id="int1" />int1</li>
<li><input name="int[]" type="checkbox" value="2" id="int2" />int2</li>
<li><input name="int[]" type="checkbox" value="3" id="int3" />int3</li>
<li><input name="int[]" type="checkbox" value="4" id="int4" />int4</li>
<li><input name="int[]" type="checkbox" value="55" id="int55" />int55</li>
</ul>

我该怎么做呢？

<ul id="list">
<li><input name="int[]" type="checkbox" value="1" id="int1" />int1</li>
<li><input name="int[]" type="checkbox" value="2" id="int2" />int2</li>
<li><input name="int[]" type="checkbox" value="55" id="int55" />int55</li>
<li><input name="int[]" type="checkbox" value="3" id="int3" />int3</li>
<li><input name="int[]" type="checkbox" value="4" id="int4" />int4</li>
</ul>

或

<ul id="list">
<li><input name="int[]" type="checkbox" value="1" id="int1" />int1</li>
<li><input name="int[]" type="checkbox" value="2" id="int2" />int2</li>
<li><input name="int[]" type="checkbox" value="3" id="int3" />int3</li>
<li><input name="int[]" type="checkbox" value="55" id="int55" />int55</li>
<li><input name="int[]" type="checkbox" value="4" id="int4" />int4</li>
</ul>

Answer 1

$("#int2").parent().after('<li><input name="int[]" type="checkbox" value="55" id="int55" />int55</li>');

这将在具有id“int2”的元素的父元素之后插入新元素。看到它正常工作here。

您需要使用parent，否则新元素将插入到与li相同的input元素中，并且具有给定的id（尽管您的问题标题是（现在）误导......在您的示例中，您希望将新元素添加为新的li，但您的标题会显示为“附加到li”。）

Answer 2

jquery中的选择器非常强大

 $("#list > li:eq(2)").after('<li><input name="int[]" type="checkbox" value="55" id="int55" />int55</li>');

Answer 3

您可以使用after()方法。例如

$('li').eq(2).after('...')

Answer 4

如果我理解你的问题，你会想做这样的事情：

var pos = 2; // Will insert before the second <li>
$('#list :nth-child(' + pos + ')').before('<li>NEW</li>');

Answer 5

.eq()和.after()的组合就足够了。 Look：）

附加到jquery中的无序列表（ul）

5 个答案: