Question

这很有效，但我确信它写得更干净。

<script>
$(document).ready(function(){
  $('.col').css({'height':($(document).height())+'px'});
  $(window).resize(function() {
    $('.col').css({'height':($(document).height())+'px'});
  });
}
</script>

我尝试过没有第一个$('.col').css...，但它不起作用。所以基本上我想告诉浏览器的是：“当文档准备就绪时，调整此div的大小，并在每次高度变化时继续调整大小”。

Answer 1

这是：

<script>
    $(window).resize(function() {
        $('.col').css({'height':($(document).height())+'px'});
    });
    $(function(){
        $(window).trigger('resize');
    });
</script>

您可以收听resize事件，并在文档准备好后触发它。

其他小变化：

您可以使用document.ready

$(function(){})

可以在document.ready之前创建resize事件侦听器，因为window对象始终存在，您可以在需要时尽早附加事件。

Answer 2

或者另一种变体，稍微（我猜）更清晰的语法：

$(window).resize(function() {
    $('.col').height($(document).height());
}).resize();

如何以更复杂的方式写这个？

2 个答案: