0

我有一组产品列表,每个列表下面都有一个链接,上面有一个点击事件,当点击它时,它会转到父类,在下面找到类“surf_prod1”并滑动切换它。其中一个函数检查所有具有“surf_prod”类的div并获取最大的innerHeight,该函数被传回并用作所有具有“surf_prod”类的div的高度。

这对第一次点击有效,但随后的点击无效,并且似乎只有初始高度有效,不确定这是否是由于某种形式的缓存?

希望有人可以提供帮助。

这是我的html:

<div class="surf_prod">
<img height="300" border="0" alt="7'2" - Egg" src="product_images/takayama_egg_7_2_egg_l0242_front.jpg"/><br/>
<span style="height: 35px;"><b id="review1615">7'2" - Egg</b></span><br/>
<div valign="top" class="surf_prod1">
    <p style="margin-bottom: 2px;"><b>N : </b>16 1/4</p>
    <p style="margin-bottom: 2px;"><b>M : </b>21 1/4</p>
    <p style="margin-bottom: 2px;"><b>T : </b>14 3/4</p>
    <p style="margin-bottom: 2px;"><b>Th : </b>2 3/8</p>
</div>
<span style="margin: 0px;"><b>FINS</b></span><br/>
<div class="surf_prod1">
    <p><b>Centre : </b>US 8" TAK 4.5</p>
    <p><b>Side : </b>FCS M5</p>
</div>
    <div class="review_box">
    <a class="review_link" href="#review1615"><b style="cursor: pointer; text-decoration: underline; color: rgb(204, 0, 0);" title="Click For Review">Board Review</b></a>
    <div style="text-align: left; display: none;" class="surf_prod1 review_body">If you're not quite ready to "rip and shred" on a short board, nor are you apt to "cruise" on a long board, then the Hawaiian Pro Designs Egg is the perfect solution. This model is an "eggy" looking shape that allows the rider to trim high on the wave in the middle of the board or race down the line on the tail, whichever the rider prefers. This board is also a perfect beginners board because of the overall forgiving shape that allows for a variety of mistakes without loss of speed or manoeuvrability.<br/><a href="http://www.surfcom.co.uk/app/content_prod/5/1615"><b>More</b></a></div>
</div>
</div>

和我的 JavaScript:

function equalHeight(group) {
var tallest = 0;
group.each(function() {
    thisHeight = $(this).innerHeight(true);
    if(thisHeight > tallest) {
        tallest = thisHeight;
    }
  });
  return tallest;
}

$(document).ready(function(){
$(".review_body").slideUp("fast");

$(".review_link").click(function(ev){
    ev.preventDefault();

    var link = $(this).attr('href');

    //Get the review container to be able to manipulate the children of it
    $(this).parent(".review_box").find(".surf_prod1").slideToggle("fast", function(){

         var surf_prod_height = equalHeight($("div.surf_prod"));
        $("div.surf_prod").height(surf_prod_height);

        document.location = link;
    });

});

});

这里的例子。

4

1 回答 1

5

一旦你设置了高度,它就不再依赖于内容,所以第二次,你得到所有 div 的相同高度——你第一次设置的高度。

在找到所需高度之前尝试将高度设置为“自动”:

$("div.surf_prod").height("auto");
var surf_prod_height = equalHeight($("div.surf_prod"));
$("div.surf_prod").height(surf_prod_height);
于 2009-02-18T13:42:44.883 回答