计算并设置某些div的高度（初始设置）。 当浏览器窗口的高度改变时->更改div的高度

Question

I need calculate and set the height for some div (initial settings). When the height of the browser window is changed --> change the height for div.

How will be better to rewrite this code (I want do initial settings once and change it when window resize):

$(document).ready(function () {
    var height = document.documentElement.clientHeight - 500;
    if (height < 135) {
        height = 135;
    }
    document.getElementById('left_space').style.height = height + 'px';

    $(window).resize(function () {
        var height = document.documentElement.clientHeight - 500;
        if (height < 135)
        {
            height = 135;
        }
        document.getElementById('left_space').style.height = height + 'px';
    });
});

Answer 1

is that what you are looking for?

api.jquery.com

jQuery(document).ready(function () {

$(window).resize(function() {
   var height = document.documentElement.clientHeight - 500;
    if (height < 135) {
        height = 135;
    }
    document.getElementById('left_space').style.height = height + 'px';

    jQuery(window).resize(function () {
        var height = document.documentElement.clientHeight - 500;
        if (height < 135)
        {
            height = 135;
        }
        document.getElementById('left_space').style.height = height + 'px';
    });

});


});

Answer 2

If you are purely looking to tidy up the code, it could look something like this:

$(document).ready(function () {

    var resizeIt = function() {
      var height = Math.max(document.documentElement.clientHeight - 500, 135);
      $('#left_space').css('height', height + 'px');
    };

    resizeIt();

    $(window).resize(function () {
        resizeIt();
    });
});

Here I have pulled out the lines of code that set the height into their own function, so the code is not duplicated. Then I took advantage of some of the shorter syntax you can use in jQuery for finding and changing styles of elements.

Answer 3

我认为jQuery（window）.resize一个会很好