将jquery函数作为可变参数传递给自定义函数

我在写一个计算最大高度/宽度并使元素高度/宽度相同的函数。我想通过2个参数给这个函数：将jquery函数作为可变参数传递给自定义函数

1. The selector, which can be(element, class) 
2. jQuery `width()`/`height()` function

和所期望的结果应该是，它看起来像功能..

Eg 1. equalDimensions('.class', width()); OR 
Eg 2. equalDimensions(div, height());

和基于什么是传递给函数width()/height()它将计算最大高度/宽度，并将所有选择器作为第一个参数传递相等的宽度/高度。

作为jQuery的新手，我很努力地将它放入代码中。

这是我到目前为止已经试过......

var equalDimension = function( selector, fn){ 
    var dimension = fn(); 
    var biggestDimemsion = 0; 
    $(selector).each(function(){ 
     if($(this).dimension > biggestDimemsion){ 
      biggestDimemsion = $(this).dimension; 
     } 
    }); 
    $(selector).each(function(){ 
     $(this).dimension(biggestDimemsion); 
    }); 
};

来源

2014-06-27 user2563864

目前我使用两个单独的自定义函数来获取相同的高度和宽度，只是将选择器作为参数传递并且它工作正常，但是创建一个函数并将宽度/高度函数传递为第二个参数。 – user2563864

我写的我会怎样解决这个问题一个简单的例子：

http://jsfiddle.net/3NRah/

var equalDimension = function (selector, fn) { 
    var $elements = $(selector), 
     dimensions = $elements.map(function (i) { 
      return $elements.eq(i)[fn](); 
     }), 
     maxDimension = Math.max.apply(Math, dimensions); 
    $elements[fn](maxDimension); 
}; 

equalDimension('div', 'height');

这假定您传递的是jQuery函数的名称，而不是函数本身。如果你想通过实际的功能，它应该是这样的：

http://jsfiddle.net/3NRah/1/

var equalDimension = function (selector, fn) { 
    var $elements = $(selector), 
     dimensions = $elements.map(function (i) { 
      return fn.call($elements.eq(i)); 
     }), 
     maxDimension = Math.max.apply(Math, dimensions); 
    fn.call($elements, maxDimension); 
}; 

equalDimension('div', $.fn.height);

编辑：若要在此干净UI方面，我想最可能添加为在下面的JSBin中。

http://jsbin.com/pogujozane/edit?js,output

$.fn.equalDimension = function (fn) { 
    var $elements = $(this), 
     dimensions = $elements.map(function (i) { 
      return $elements.eq(i)[fn](); 
     }), 
     maxDimension = Math.max.apply(Math, dimensions); 
    $elements[fn](maxDimension); 
}; 
$.fn.equalHeight = function() { 
    return $(this).equalDimension('height'); 
}; 
$.fn.equalWidth = function() { 
    return $(this).equalDimension('width'); 
}

，以便它可以这样调用：

$('div').equalHeight();

来源

2014-06-27 14:50:52

比我的（现在删除的）答案要干净得多。 –

辉煌。你的解决方案都很完美。谢谢罗伯特。只是想从jQuery的角度来看，哪一个更好一些，使用字符串或函数作为参数，以及为什么（如果您可以请解释原因） – user2563864

我不确定是否比其他 - 但我确实认为你得到的错误对于第二种解决方案会更加明显 - 它只是要求你知道jQuery的功能在哪里。 –

你真的应该传递一个刺，而不是一个函数的和做somthine这样的：

var equalDimension = function( selector, fn){ 
    var dimension = fn === 'width' ? 'width' : 'height'; //Prevent from runing any other jQuery functions 
    var biggestDimemsion = 0; 
    $(selector).each(function(){ 
     if($(this)[dimension]() > biggestDimemsion){ 
      biggestDimemsion = $(this).dimension; 
     } 
    }); 
    $(selector).each(function(){ 
     $(this)[dimension](biggestDimemsion); 
    }); 
}; 

equalDimension('selector', 'width');

注意，第二个可以忽略：

var equalDimension = function( selector, fn){ 
    var dimension = fn === 'width' ? 'width' : 'height'; //Prevent from runing any other jQuery functions 
    var biggestDimemsion = 0; 
    $(selector).each(function(){ 
     if($(this)[dimension]() > biggestDimemsion){ 
      biggestDimemsion = $(this).dimension; 
     } 
    }); 
    $(selector)[dimension](biggestDimemsion); 
};

来源

2014-06-27 14:52:41

将jquery函数作为可变参数传递给自定义函数

回答

相关问题