0

当尝试在 Jquery 中渲染页面期间获取元素尺寸时，我经常发现自己必须像这样设置超时：

window.setTimeout(function(){
    console.log("calculate footer height");
    console.log( $('div:jqmData(role="footer")') )
    console.log(  wrap.find('.ui-footer').css("height") )
    },0);

它返回正确的值（在这种情况下46px），同时在没有超时的情况下执行此操作

    console.log("calculate footer height");
    console.log( $('div:jqmData(role="footer")') )
    console.log(  wrap.find('.ui-footer').css("height") )

将返回元素，但其宽度将是0px

问题：
为什么会这样，更重要的是，有没有比setTimeouts在示例中诉诸喜欢更好的方法？请注意：我不能影响元素的渲染，因为这是由 Jquery Mobile 完成的，所以上面必须从不同的“位置”运行

谢谢！

4

2 回答 2

1

你应该响应 onload 事件

例如：

$( function() {

    console.log("calculate footer height");
    console.log( $('div:jqmData(role="footer")') );
    console.log(  wrap.find('.ui-footer').css("height") );

} );

您的超时允许浏览器呈现，因此您检索正确的值。使用 onload 变体等到页面加载完毕然后触发。

通常还有一些其他的符号，比如

$( document ).ready( function() { .... });

的

$().ready( function() { .... });

我更喜欢

(function($) {
    $( function() { ... } );
} ( jQuery ) );

确保 $ 代表 jQuery

于 2012-10-27T11:58:57.100 回答
0

行。还没有找到解决方案，但我将问题追溯到以下问题：

  • 插件 A 被加载，初始化被阻止，所以元素不会得到它们的尺寸。
  • 插件 B 在初始化插件 A 的过程中被加载和初始化。
  • 插件 B 然后尝试获取元素尺寸，但由于 A 尚未完全运行，元素仍然未增强（= 无类，无宽度）

我还没有真正找到解决这个问题的方法，因为
a）我需要手动触发插件A（= Jquery Mobile），否则它不会很好地与（在vsrequireJS上初始化）和 b）我自己的插件需要它在Jquery之前设置的事件绑定手机可以初始化，所以我需要手动触发。mobileinitdocReady

如果有人知道解决方法，我会检查作为答案。

感谢您发布。

于 2012-10-27T18:18:53.450 回答