先来看现象： 复制代码 代码如下: <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 复制代码 代码如下: <div id="cc"></div> <script> $(document).ready(function() { $("#cc").append("<img id='aa' src='http://www.jb51.net/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居然一开始还会计算出一个错误值出来的。 改成下面这样就都好了： 复制代码 代码如下: <div id="cc"></div> <script> $(document).ready(function() { $("#cc").append("<img id='aa' src='http://www.jb51.net/images/logo.gif' />"); window.setTimeout(function(){alert($("#aa").width()); },100); }); </script> 有解决过此问题或有关于此问题更详细的认识的大鸟还望不吝赐教.. 复制代码 代码如下: $(document).ready(function() { $("#cc").append("<img id='aa' />"); $("#aa").load(function(){ alert($("#aa").width() }).attr("src", "http://www.jb51.net/images/logo.gif"); });

　　推荐阅读

　　javascript 二维排序表格代码

功能如下： 1.排序功能：单击行表头或列表头则进行正序排序；若再次单击，则进行逆序； 2.修改功能：双击某个单元格，则可进行输入操作，当输入框失去焦点时，则新数据被保存； 3.随机功能：每次刷新页面，表格中的>>>详细阅读

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

地址：http://www.17bianji.com/kaifa2/JS/25255.html

 1/2    1