jquery resizable append image size问题答案

【问题标题】：jquery resizable append image size problemjquery resizable append image size问题
【发布时间】：2011-02-01 03:21:32
【问题描述】：

我有下面的简单代码，它在单击按钮时将图像附加到#container。问题是当我第一次单击按钮时，图像大小未正确附加。但是当再次单击按钮时，我们会得到具有正确图像大小的附加图像。如果我们从等式中删除 resizable() 就不会发生这种情况。

为什么第一次点击没有得到正确的图像大小。代码如下：

<button id="test">add me</button>
<div id="container"></div>

<script type="text/javascript">
$('#test').live('click',function(){
    var elm = '<img src="http://www.navegabem.com/blog/wp-content/uploads/2009/04/firefox-icon.png" />'
    $(elm).appendTo('#container').resizable().parent().draggable();
});
</script>

【问题讨论】：

“图像大小未正确附加”是什么意思？你的代码似乎是work for me。
第一次点击时您没有获得正确的图像尺寸，图像附加小于实际尺寸。在第二次单击时，它可以工作。清除浏览器缓存并在 chrome 和 firefox 中尝试。加载解决问题

标签： jquery image size resizable

【解决方案1】：

在加载时使其可调整大小：

$(elm).load(function(){$(this).resizable();}).appendTo('#container').parent().draggable();

如果你在不清楚图像的大小之前这样做，那么 resizable 的初始大小设置为 0/0

【讨论】：

谢谢。我在发布问题后就想通了。