javascript - jQuery 等待更长时间，直到调用函数

Question

所以我有这个元素，我需要获取width()and height()of，但它一直返回 0，但是当我进入$('#lightingData').width()控制台时，它给了我正确的值。我想我需要使用其他一些包装函数，我已经尝试$(document).ready(function() {...});过$(window).load(function(){...});

是否有其他包装函数会在执行前等待更长时间？

Answer 1

如果#lightningData元素display:none在onload触发并且您的代码执行时具有， widht()并且height()将返回 0。您可以.show()在检查尺寸之前显式调用该元素

 $('#lightingData').show().width();

Answer 2

.width()您可以尝试的一件事是在尝试调用and之前显式等待加载该特定元素.height()。

尝试这个：

$('#lightingData').load(function() { 
     ...height and width manipulation here...
     ...don't forget about scope...
});

你应该把它放在你$(document).ready(...)的 . 文件中，因为你会希望文档至少知道它是什么$('#lightingData')。因为你得到0的是height而width不是错误，所以我可以假设它们至少是在调用方法之前找到的。

更新

根据@Ian 添加的评论，我想指出这仅适用于某些类型的元素（URL、IFrame、图像/媒体等——基本上是任何需要加载其内容的元素）。我不会更新代码，因为如果您将它用于其中一种元素，我上面的内容是正确的，如果您将它用于另一种元素，那将是愚蠢的。如果您同时使用它，您只需要添加一个条件/过滤器（基于您的实现）来确定此代码是否应该绑定到该特定元素。

Answer 3

如果您 100% 确定 $(document).ready() 处的宽度仍为 0

尝试这个：

$(function () {
    $('#lightingData').show(function(e) {
        var width = $(this).width();
        //do something
    });
});

或者，一些愚蠢但适用于 90% 的情况：

$(function() {
    setInterval(function () {
        var width = $('#lightingData').width();
        //do something
    }, 1000);
});

这将在 $(document).ready() 之后将操作延迟 1 秒。

如果没有确切的场景，很难给出具体的解决方案。