在Web应用程序上,我需要处理大量高分辨率图像,这些图像会动态添加到DOM树中.它们已预先加载,然后添加到页面中.
检测这样的图像何时完成加载是一回事,为此我使用了该load事件,但是如何使用Javascript 检测它何时在浏览器中完成呈现?使用高分辨率图像时,实际的绘画过程可能需要花费大量时间,因此了解它何时结束非常重要.
我得到一些HTML并插入它.html(),之后我试图获得一个新插入的元素的宽度.width()(具有CSS规则).但有时 - 宽度未被拾取,并返回为0.
是因为JS在新创建的元素及其CSS中"超前"运行?我尝试过链接,.html('...').find('...').width()但有时候仍然无效.是什么原因,是否有解决方法?
编辑:按流行需求,示例:
/* ajax.response is:
<div class="boxes">
<div class="box width-A">test 1</div>
<div class="box width-B">test 2</div>
<div class="box width-C">test 3</div>
</div> */
var boxOutput = $('.boxOutput'); /* .boxOutput is already on the page */
boxOutput.html(ajax.response);
// make width of ".boxes" equal to the sum of all ".box"
var boxWidth = 0;
$('.box', boxOutput).each(function(i) {
boxWidth += $(this).width(); /* this is where sometimes width returns 0 */
});
$('.boxes', boxOutput).css('width', boxWidth); …Run Code Online (Sandbox Code Playgroud) 在我正在编写的脚本中,我将一个反馈表单的标记附加到正文,然后使用jQuery将该元素(一个DIV)集中在屏幕上.在下面的代码示例中,form_code保存了我的表单标记.#feedback_form定义的CSS样式明确定义了宽度.但是,在追加后立即调用的width()计算错误,返回的维度几乎等于页面的整个宽度.
如果我用控制台警告宽度,即使几秒钟后,它也会正确计算.从来没有碰到这个,有人可以对此有所了解吗?
jQuery('body').append(form_code);
alert(jQuery("#feedback_form").css("width"));
Run Code Online (Sandbox Code Playgroud)