使用jquery从外部源将信息加载到div后，获取div的高度和宽度

Question

我看到过类似的问题，但还没有找到适合我情况的答案。我使用jQuery创建了一个简单的模式弹出插件，运行方式如下：$('#popup').popupElement("http://www.example.com #somediv");

当点击选择器#popup时，它会从另一个网站加载div。点击功能如下：

            $(thisObj).click(function(e){
            e.preventDefault();
            $("#popupDiv").load(div);
            centerPopup();
            loadPopup();
        });

问题是，当它将外部div加载到popupDiv中时，popupDiv的高度和宽度都是0，因此centerPopup（）无法将其居中。点击#popup链接几次后，popupDiv的尺寸自行修复。有没有办法确保在调用centerPopup（）之前将popupDiv设置为正确的维度？

Answer 1

尝试将对centerPopup()和loadPopup()的调用放在load()的回调函数中。这将确保在您尝试显示弹出窗口之前，内容在DOM中，这意味着高度和宽度应该是可访问的。试试这个：

$(thisObj).click(function(e){
    e.preventDefault();
    $("#popupDiv").load(div, function() {
        centerPopup();
        loadPopup();
    });
});

Answer 2

您是否尝试过默认隐藏元素，然后在调用centerPopup（）之前，显示它，但保持它的可见性隐藏，然后检查它的宽度（）和高度（），看看它是否已经有维度？