如何在另一个元素后添加元素？

Question

我有一个文本框，我想在它后面添加一个div。 我尝试了.append()函数，但那只会将div添加到元素中。

例如，我有：

<input type="text" id="bla" />

我想把它改成：

<input type="text" id="bla" /><div id="space"></div>

- Jelle De Loecker

Answer 1

尝试使用after()方法：

$('#bla').after('<div id="space"></div>');

文档

- Rowan

---

.after()和.insertAfter()方法执行相同的任务。 - Rifat

没错，但这取决于你偏好的编码方式。通常我会已经选中'#bla'输入，然后再添加额外的内容。纯粹是我的个人喜好，我不确定任何一种方法是否有速度优势。 - Rowan

Answer 2

尝试

.insertAfter()

这里

$(content).insertAfter('#bla');

- Rifat

---

你的代码应该更像$('<div id="space"></div>').insertAfter('#bla')而不是$('#bla').insertAfter(content);？ - Rowan

Answer 3

首先，input元素不应该有闭合标签（来自http://www.w3.org/TR/html401/interact/forms.html#edef-INPUT：结束标签被禁止）。

其次，你需要使用after()函数而不是append()函数。

- naivists

---

正确，但这就是当我尝试使用 .append() 函数时发生的事情。 - Jelle De Loecker

如果是XHTML，则输入元素应该被关闭（但不使用结束标记）。 - CiscoIPPhone

在HTML4中，<input>标签不应该被关闭。 - Derek 朕會功夫

Answer 4

已解决的jQuery问题：在另一个元素后添加元素

<script>
$( "p" ).after( "<strong>Hello</strong>" );
</script>

或者

<script type="text/javascript"> 
jQuery(document).ready(function(){
jQuery ( ".sidebar_cart" ) .insertAfter( "<a href='http://#'>Continue Shopping</a>" );
});
</script>

- Ashar Zafar

---

这是不正确的。这将元素添加到父元素中，就像原帖所述。请再次阅读问题并修改您的答案。 - Evan Wieland

已解决100％，尝试使用after()方法： - Ashar Zafar