Question

我当前正在创建一个网站，我需要根据其中一个孩子的偏移来调整div的大小。所以，我这样做：

<script type="text/javascript">

      $(document).ready(function(){ 
        if($(sizer)[0].scrollHeight > 500)
        {
            $(maincnt).height( ($(sizer)[0].scrollHeight + 300) );
        }
      });

</script>

但是，问题是Firefox没有触发事件。但是使用chrome它可以工作。是否有更简洁的方式来符合div大小？如果没有，有没有办法让它被Firefox触发？这是我的HTML代码：

<div id="maincnt" >
<div style="position:relative;">
<div id="sizer" style="position:absolute;top:12px;left:10px;width:750px;">
   <!-- Dynamically added things -->
</div>
</div>
</div>

编辑：我放弃了，我找到了解决我的第一个问题的另一种解决方法，而不是JQuery问题。

Answer 1

问题可能是当触发DOMready事件时，浏览器尚未计算所有宽度和高度。当页面结构可以使用时，而不是在加载了css时，会触发DOMready事件。

尝试在load事件上执行此类工作，该事件在加载页面的所有资源时触发，包括css：

$(window).load(function(){ 
    if($(sizer)[0].scrollHeight > 500) {
        $(maincnt).height( ($(sizer)[0].scrollHeight + 300) );
    }
});

Answer 2

问题几乎可以肯定是因为你正在处理DOM元素，好像JS预先填充了ID作为变量。

尝试$('#sizer')和$('#maincnt')，而不是您目前拥有的那些。

另外，为什么要使用绝对定位的元素呢？只需将其设置为margin: 12px 0px 0px 10px; width: 750px;？

，这有什么问题

根据div的大小来确定其内容

2 个答案: