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绝对定位。