Question

例如：

var $myContainer = $('#myContainer');
$myContainer.html(someHtml);
var width = $myContainer.height();
var height = $myContainer.height();

如果#myContainer是一个空div，则宽度和高度仍为零。解决方案是使用超时：

var $myContainer = $('#myContainer');
$myContainer.html(someHtml);
setTimeout(function () {
    var width = $myContainer.height();
    var height = $myContainer.height();
}, 500);

然而，我不喜欢那里的神奇数字。如果它的浏览器真的很慢怎么办？是否有可靠的跨浏览器方法可以告诉我何时浏览器已呈现更改？

Answer 1

您可以可靠地使用0进行超时。它实际上不会是0ms，你知道，大多数浏览器会使它至少达到5或10，但只是屈服于浏览器的行为就足够了。

那就是说，我是not immediately finding一个浏览器，它没有立即得到（新）高度，没有收益（甚至是IE6！）。但是，如果取决于标记等，我不会感到惊讶......

Answer 2

感觉像黑客但可能有效：将一个脚本元素添加到DOM作为最后一个元素。在所有其他元素都已“安定下来”之后，所有浏览器都应执行该操作。

Answer 3

您使用的是ajax吗？

所以你可以使用jQuery'load'。

var $myContainer = $('#myContainer');
$myContainer.load('/url/for/someHtml', function(){
  var width = $myContainer.height();
  var height = $myContainer.height();
});

有没有一种程序化的方式来了解jQuery的DOM更新何时完成？

3 个答案: