前置不會img標籤

Question

這是我的jQuery代碼中添加HTML ....

$("#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........ 

前面加上它會工作的形式.......但它只是不會出現之前的圖像...

Answer 1

而不是prepend()，嘗試before()如下所示，與有效的HTML。

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。

Answer 2

從the manual：

的.prepend（）

您不能插入內容的方法插入指定的內容，每個元素的jQuery的集合中的第一個孩子圖像的第一個孩子，因爲圖像不能有孩子。

您想要before()在圖像之前插入內容。