マージ2つのjQueryの機能

Question

I持ってbasicly彼らの第一行以外は同じに書かれている2つのjQueryの機能：

$(document).ready(function() { 
var h = $(window).height(); 
var w = $(window).width(); 
$('#foo').css({'height' : h}); 
$('#foo').css({'width' : w}); 
}); 

$(window).resize(function() { 
var h = $(window).height(); 
var w = $(window).width(); 
$('#foo').css({'height' : h}); 
$('#foo').css({'width' : w}); 
}); 

ので、私は思っていたならばその可能1いくつかの方法にそれらをマージするには？

いつもありがとうございます。

Answer 1

は手動resizeイベントをトリガすることができます

$(function() { // shortcut for $(document).ready(function() {...}); 
    $(window).resize(function() { // bind the handler 
     $('#foo').css({ 
      'height': $(window).height(), 
      'width': $(window).width() 
     }); 
    }).resize(); // trigger the resize event 
}); 

をや余分な機能を作成し、両方のイベントにバインド：ところで

function resizeHandler() { 
    $('#foo').css({ 
     'height': $(window).height(), 
     'width': $(window).width() 
    }); 
} 

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

---

。 のショートカットは$(function(){...});です。このよう

Answer 2

var myFunction = function() { 
var h = $(window).height(); 
var w = $(window).width(); 
$('#foo').css({'height' : h}); 
$('#foo').css({'width' : w}); 
} 

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

Answer 3

：（長いが、より理解しやすい）、それを呼び出すための

function yourfunc() { 
var h = $(window).height(); 
var w = $(window).width(); 
$('#foo').css({'height' : h}); 
$('#foo').css({'width' : w}); 
} 

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

もう一つの方法は、次のようになります。

$(document).ready(function(){ 
    yourfunc(); 
}); 
$(window).resize(function(){ 
    yourfunc(); 
}); 

両方の仕事。お役に立てれば。乾杯

Answer 4

function calculateSomething(){ 
    var h = $(window).height(); 
    var w = $(window).width(); 
    $('#foo').css({'height' : h, 'width' : w}}); 
} 

その後、あなたはまたやる使用することができ

$(document).ready(calculateSomething); 

$(window).resize(calculateSomething); 

Answer 5

関数を呼び出す第三の機能を作成します。

$(window).bind('load resize', function(e){ 
    $('#foo').css({'width' : $(window).width(), 'height': $(window).height()}); 
});