如何定位类中的元素，而不在其他地方使用的同一类中定位元素？ （jQuery的）

Question

我有一个floated元素列表，我想要相同的height。但是每页有多个列表，它们都使用相同的类名。

如何为每个列表重置tallest变量，以便它们不是都从页面上最高的列表项继承高度，而只是从它自己的列表中继承？

这是我的HTML：

<ul class="thumbs">
   <li class="thumb">
      <img />
      <p>Some text</p>
   </li>
   <li class="thumb">
      <img />
      <p>Some text</p>
   </li>
</ul>

<!-- Same classnames, different content. Just an example, it's not 
     necessary with or without images                           -->
<ul class="thumbs">
   <li class="thumb">
      <p>Some text</p>
      <p>Some more text</p>
   </li>
   <li class="thumb">
      <p>Some text</p>
   </li>
</ul>

这是我正在使用的jQuery equalHeights plugin：

(function($) {
    $.fn.equalHeights = function(minHeight, maxHeight) {
        tallest = (minHeight) ? minHeight : 0;
        this.each(function() {
            if($(this).height() > tallest) {
                tallest = $(this).height();
            }
        });
        if((maxHeight) && tallest > maxHeight) tallest = maxHeight;
        return this.each(function() {
            $(this).height(tallest).css("overflow","auto");
        });
    }
})(jQuery);

我打电话给：

$(function() {
   $('.thumb').equalHeights();
});

我也不想在标记中添加新的类或id。

感谢。

更新 - 添加了我所拥有的不同<li>的一些示例。有很多，所以甚至不确定我是否已经把它们全部放在这里：

<ul class="thumbs">
<li class="thumb first">
    <p class="boxHeading">Featured collection</p>
    <h3><a class="boxFeatured" href="#">Dining chair <span class="by">by bowline</span></a></h3>
    <div class="img">
        <img src="media/dummy/diningChair.jpg" width="250" height="180" alt="Dining chair" />
    </div>
</li>
</ul>

<ul class="thumbs">
<li class="thumb">
    <div class="img">
        <img src="media/dummy/diningChair3.jpg" width="204" height="156" alt="DiningChair3" />
    </div>
    <h4 class="readMore"><a class="readMore" href="link/that/biggerlink.js/follows">Product name</a></h4>
    <dl class="boxDescription">
        <dt>By:</dt>
        <dd><a href="#">Vincent Shephard</a></dd>
        <dt>Colour:</dt>
        <dd>brown, white</dd>
        <dt>Price:</dt>
        <dd>$XXX.XX</dd>
    </dl>
</li>
</ul>

<ul class="thumbs">
<li class="thumb">
    <h3 class="boxHeading"><a href="#">Featured collection</a></h3>
    <div class="img">
        <img src="media/dummy/diningChair.jpg" width="232" height="180" alt="Dining chair" />
    </div>
    <p class="readMore">
        In one word, you reproach us with intending 
        to do away with your property.  Precisely so; 
        that is just what we intend.
    </p>
</li>
</ul>

<ul class="thumbs">
<li class="thumb first">
    <h3 class="boxHeading"><a href="#">Tables (category)</a></h3>
    <div class="img">
        <img src="media/dummy/diningChair.jpg" width="232" height="180" alt="Dining chair" />
    </div>
</li>
</ul>

<ul class="thumbs">
<li class="thumb first">
    <h4 class="small"><a class="small" href="test.html">Product name</a></h4>
    <div class="img">
        <img src="media/dummy/diningChair.jpg" width="204" height="156" alt="Dining chair" />
    </div>
</li>
</ul>

<ul class="thumbs">
<li class="thumb dropShadow offwhite first center">
    <div class="img">
        <img src="media/dummy/recent1.jpg" width="134" height="180" alt="Advertisement1" />
    </div>
    <h4 class="small bold"><a class="small bold">Inside Out</a></h4>
    <p>July 2009</p>
</li>
</ul>

应该涵盖所有这些，尽管我可能错过了一些。谢谢你的耐心。

Answer 1

$('.thumbs').each(function(){
    $('.thumb', this).equalHeights();
});