JQUERY-来自相同类别元素的特定值

问题描述

| 编辑：昨晚我真的很累，并且将jQuery写错了，\ .readMore \始终是其各自div动画的触发器。我道歉。 大家好， 我想从具有相同类的元素中提取特定信息。我有多个包含不同数量文本的div，因此它们的高度也有所不同。但是，我将与这些div关联的类设置为200px的高度。在每个div的底部，我都有一个绝对定位的锚点，使读者可以将div扩展（动画化）到其自动/自然高度。 我想做的是找出具有相同类的div的'auto'高度，将其存储起来，然后稍后在单击各个div的锚点时调用它。到目前为止，我一直只获得一个价值或没有价值，而我希望所有价值。 我最近一直在使用.each（），但无济于事。真正的问题似乎是对div进行动画处理，否则就没有问题。只需使用.css（）将高度设置为自动。如果您可以将自己的身高设置为自动，这将容易得多。希望我能正确解释自己。无论如何，这是我的代码。 的HTML

<div class=\"stretch\">
    text
    <a class=\"readMore\">Read More</a>
</div>

<div class=\"stretch\">
    text
    <a class=\"readMore\">Read More</a>
</div>

<div class=\"stretch\">
    text
    <a class=\"readMore\">Read More</a>
</div>

的CSS

div.stretch {height:auto; width:100%; overflow:hidden; position:relative}
a.readMore {position:absolute; left:0; bottom:0;}

jQuery查询

$divheight = //stored height of divs
$allheight = $divheight + 100; //extra space to clear the anchor
$(\".h200\").height(200);
$(\".stretch\").addClass(\"h200\"); //change height later,to be able to refer to automatic/natural height

$(\".readmore\").toggle(
    function(){
        $(this).parent(\'div\').animate({height:$allheight},750);
        $(\".readMore\").text(\"Read Less\");
    },function(){
        $(this).parent(\'div\').animate({height:\"200px\"},250);
        $(\".readMore\").text(\"Read More\");
    }
)

谢谢前进，即使您看一眼，我也非常感谢。     

解决方法

        尝试这个：

$hiddenheight=200;
$extraspace=100;

$(\".stretch\")
.each(function(){
    $(this).data(\'actualheight\',$(this).outerHeight()+$extraspace).css(\'height\',$hiddenheight+\'px\');    //outerHeight for including padding+margin+border,if any
})
.toggle(
    function(){
        $(this).animate({height: $(this).data(\'actualheight\')+\'px\'},750);
        $(\".readMore\").text(\"Read Less\");
    },function(){
        $(this).parent(\'div\').animate({height:$hiddenheight+\"px\"},250);
        $(\".readMore\").text(\"Read More\");
    }
)

根据需要调整高度值。     ,        $ .height（）将返回元素的实际高度。储存它，在叫ѭ4re时重新使用。 像这样：

$(\".stretch\").toggle(
    function(){
        $(this).data(\'oh\',$(this).height());
        $(this).animate({height: 200},750);
    },function(){
        $(this).animate({height: $(this).data(\'oh\')},250);
        $(this).data(\'oh\',null);
    }
)