Question

var currentTallest = 0;

if($j(".eachLateDeal").exists()){
  $j(this).children().find(".resultList").each(function(i){      
    if($j(this).height() > currentTallest){
      currentTallest = $j(this).height();
    }
});

  $j(this).children().find(".resultList").each(function(i){      
    if (!$j.support.minHeight){
      $j(this).css({'height': currentTallest + 5});
    }

    $j(this).css({'min-height': currentTallest});  
});      
}

更新：在考虑了所有建设性意见之后，我提出了以下似乎按预期工作的内容：

$j.fn.equalHeights = function(px) {
$j(this).each(function(){
    var currentTallest = 0;
    var results;

if($j(".eachLateDeal").length){
  results = $j(".resultList", ".eachLateDeal");
}else{
  results = $j(this).children();
}

$j.each(results, function(){
  if($j(this).height() > currentTallest){
    currentTallest = $j(this).height();
  }
});

var cssProp = {};

if (!$j.support.minHeight){
  cssProp["height"] = currentTallest + 5;
}else{
  cssProp["min-height"] = currentTallest;
}

results.css(cssProp);
});

};

全部谢谢！

Answer 1

查看this answer您可以使用JavaScript Math对象为您获取最大值，这意味着您可以将所有功能包装到一个循环中：

$(document).ready(function() {

    Array.max = function( array ){
            return Math.max.apply( Math, array );
        };

    if($j(".eachLateDeal").length) {
        var heights= new Array();
        var resultLists = $j(this).children().find(".resultList");
        resultLists.each(function() {
            heights.push($j(this).height());
        });
        var max = Array.max(heights);
        var propertyName = 'min-height';
        if(!$.support.minHeight) {
            max = max + 5;
            propertyName = 'height';
        }
        resultLists.css(propertyName, max);
    }   
});

JSFiddle example here

Answer 2

首先，如果你有一个exists（）函数，那么如果你刚才这样做会更容易：

$j(".eachLateDeal").length

它几乎做同样的事情（不需要声明额外的功能）

第二

$j(this).children().find(".resultList").each(function(i){

可以写成

$j(this).find(".resultList").each(function(i){

因为find会查看所有它的后代

第三，为什么你需要两次进入循环？

Answer 3

您的选择器的一个想法：使用“上下文”，它限制搜索的范围，而不是获取所有子项并查找返回的数据：

var oScope = $("selectorX");
$j(".resultList", oScope).each(function(i){ ...

Answer 4

使用reduce，您可以将其简化为以下内容：

$.reduce = function(elems, callback, memo, arg) {
    for (var i = 0, length = elems.length; i < length; i++) {
        memo = callback(elems[i], i, memo, arg);
    }

    return memo;
};

$.fn.reduce = function(callback, memo) {
    return jQuery.reduce(this, function(elem, key, memo) {
        return callback.call(elem, elem, key, memo);
    }, memo);
};

if ($j(".eachLateDeal").length) {
    // get results
    var results = $j(this).children().find(".resultList");
    // reduce results to tallest height
    var currentTallest = results.reduce(function(val, i, memo) {
        var h = $j(this).height();
        return h > memo ? h : memo;
    }, 0);

    // set css properties
    var cssProp = {};
    if (!$j.support.minHeight) {
        cssProp["height"] = currentTallest + 5;
    } else {
        cssProp["min-height"] = currentTallest;
    }
    // set css of all elements at once.
    results.css(cssProp);
}

jQuery：有没有更好的方法来写这个？多个each（）循环

4 个答案: