jQuery的插入無父元素調整

Question

我有以下結構：

<td> 
    <input name="foo" size="45"/> 
</td> 

，我要動態地插入圖片後，然後將其定位裏面輸入，就像這樣：

$j('<img class="icon-ketchup" style="display: none; position: relative; right: 35px; top: 7px;" src="http://localhost:82/pod/plugin_assets/webshop/images/icons/cross.png" />').show().insertAfter($j('input')); 

我td與input大小相同，我不想調整td元素的大小。這是如何實現的？

Answer 1

您需要將其放在絕對位置。 Javascript是不需要的，但仍然可以使用它你想要的。見http://jsfiddle.net/C7trn/

HTML

<td style="position: relative; border: 2px solid black; padding: 5px;"> 
<input name="foo" size="45"/> 
<img class="icon-ketchup" style="position: absolute; right: 5px; top: 7px;" src="http://localhost:82/pod/plugin_assets/webshop/images/icons/cross.png" /> 
</td>​ 

的關鍵是使TD position: relative;並具有圖像position: absolute。這將使圖像相對於td絕對定位。