Jquery 可重用代码

Question

我有一些 jquery 代码，用于根据其宽度设置 div 高度。 JSFiddle example here .

一切都按原样工作，但我想要的是一个可重用的函数，这样我就不会为每个唯一的 id 创建完全相同的函数。该代码目前仅适用于 #bigHug div，但我希望能够执行类似 $('#biggerHug').setHeight(1.8) 的操作。在 .ready和.resize函数并为提供的 id 设置高度。

我尝试通过放置 $(this).width() 来解决问题而不是$('#bigHug').width()在 setHeight功能，但一切都“坏了”。 div 在加载或窗口大小调整时不会显示。我认为这与$(this)有关引用$(window).ready而不是 $('#bigHug').setHeight(1.8) .

想法？

Answer 1

试试这个:

function setHeight(ratio, elem ) {
    $elem = $(elem);
    var divWidth = $elem.width();
    var divHeight = divWidth / ratio;
    $elem.height(divHeight);
}


$(window).ready(function() {
    setHeight(1.8, '#bigHug');
});

$(window).resize(function() {
    setHeight(1.8, '#bigHug');
});​

<强> DEMO