jQuery 结合 .ready 和 .resize

Question

当调整窗口大小时，我的 jQuery .ready 函数中的一些（嗯，几乎全部）代码也适用，因为它是布局工作。但是，由于它是相同的代码，我如何“组合”这两个函数，以便我的代码不会重复（并且维护起来很混乱）？

谢谢！

Answer 1

$(document).ready(myfunction);
$(window).on('resize',myfunction);

function myfunction() {
    // do whatever
}

另一种技术是将 .trigger() 一个事件放在另一个事件中：

$(window).on('resize',function() {
    // do whatever
});
$(document).ready(function() {
    $(window).trigger('resize');
});

如果您将代码放在页面底部以避免需要 $(document).ready，它变得更简单：

$(window).on('resize',function() {
    // do whatever
}).trigger('resize');

Answer 2

又一个更好的选择

$(window).on("load resize",function(e){
  function abc() {
    // code here
  }
});

Answer 3

像这样的东西？？

function mySetupFunction() {
    // stuff here.
}

$(document).ready(mySetupFunction);
$(window).resize(mySetupFunction);

Answer 4

以下代码可能有助于在调整大小准备就绪之后执行操作。

var resizeTimer;

$(window).on('resize', function(e) {

  clearTimeout(resizeTimer);
  resizeTimer = setTimeout(function() {

    // Run code here after resizing has done
            
  }, 250);

});

以下是在调整大小时运行代码的问题。

$(window).on('resize', function(e) {
  // Run code here while resizing is under going
});