源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

关于用Jquery的height()、width()计算动态插入的IMG标签的宽高的问题

  • 时间:2022-07-02 20:09 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:关于用Jquery的height()、width()计算动态插入的IMG标签的宽高的问题
先来看现象:
[u]复制代码[/u] 代码如下:
<div id="cc"></div> <script> $(document).ready(function() { $("#cc").append("<div id='aa' style='width:200px;height:200px;' /></div>"); alert($("#aa").width()); }); </script>
结果为:200 所有浏览器都得到正确的结果 把插入的元素改为IMG
[u]复制代码[/u] 代码如下:
<div id="cc"></div> <script> $(document).ready(function() { $("#cc").append("<img id='aa' src='http://www.1sucai.cn/images/logo.gif' />"); alert($("#aa").width()); }); </script>
(注:image1.jpg的实际宽为693) 结果为: Opera:34 Firefox:0 IE:28 Chrome:0 Safari:0 再F5刷新一下,结果为: Firefox:693 IE:693 Opera:693 Chrome:0 Safari:0 Safari和Chrome始终为0。 应该可以理解为在图片没有加载或呈现完成时计算出的图片宽高也是不正确的,刷新后应该是有了缓存,所以结果就正确了,但为什么Chrome 和Safari始终都为0呢?而且IE和OPERA居然一开始还会计算出一个错误值出来的。 改成下面这样就都好了:
[u]复制代码[/u] 代码如下:
<div id="cc"></div> <script> $(document).ready(function() { $("#cc").append("<img id='aa' src='http://www.1sucai.cn/images/logo.gif' />"); window.setTimeout(function(){alert($("#aa").width()); },100); }); </script>
有解决过此问题或有关于此问题更详细的认识的大鸟还望不吝赐教..
[u]复制代码[/u] 代码如下:
$(document).ready(function() { $("#cc").append("<img id='aa' />"); $("#aa").load(function(){ alert($("#aa").width() }).attr("src", "http://www.1sucai.cn/images/logo.gif"); });
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部