Prepend不会在img标记中添加HTML

时间:2012-07-19 16:01:28

标签: jquery html forms

这是我的jquery代码......

$("#addinp").click(function() {
    $(this).prepend('<label>Item ' + i + '<span class="small"></label><input type="text" name="middlename[]" />');
});

这是我的HTML ....

<form id="form" name="form" method="post" action="?a=run">
<input type="text" name="firstname" id="firstname" />
<input type="text" name="lastname" id="lastname" />
<input type="text" name="middlename[]" id="middlename[]" />
<img src="add_another_name.png"  id="addinp"/>
<button type="submit">Add</button>
 </form>

这不会在“添加另一个按钮”之前显示另一个输入 - 如果我这样做会很烦人......

 $('form').prepend('<lab........

将它添加到它将起作用的形式.......但它不会出现在图像之前......

2 个答案:

答案 0 :(得分:3)

而不是prepend(),请使用有效的HTML尝试before(),如下所示。

prepend()在这里不起作用,因为它在目标的开头将传递的元素作为子元素插入。

$("#addinp").click(function() {
    $(this)
     .before('<label>Item '+i+'<span class="small"></span></label><input type="text" name="middlename[]" />');
});

您还可以使用.insertBefore()

$("#addinp").click(function() {
   $('<label>Item '+i+'<span class="small"></span></label><input type="text" name="middlename[]" />').insertBefore(this);
});

请勿忘记更正上述HTML。

答案 1 :(得分:2)

来自the manual

  

.prepend()方法将指定的内容作为jQuery集合中每个元素的第一个子元素插入

您无法将内容作为图像的第一个子项插入,因为该图像不能包含子项。

您希望before()在图片前插入内容。