我想写一个函数来允许展开和折叠div。尽管如此,它并不那么直截了当。如果div高于50px,我需要添加一个图标(“展开”)以允许将其展开至全高。当它完全展开时,我需要将图标的样式更改为(“折叠”)并将其折叠回50px。该图标需要位于div的右下角。部分或全部展开/折叠w/jQuery
我可以在一个页面上有多个这样的div。
现在,我可以得到一个div的高度,但我怎么做的页面和onload上的每一个?
var divHeight = $('.myDiv').height();
if (divHeight > 50) {
$('.icon_collase').appendTo('.myDiv');
}
<style>
.collasedDiv {
max-height:50px;
}
</style>
$(".icon_collase").click(function() {
$('.icon_collase').toggleClass('icon_collase icon_expand');
$('.myDiv').addClass('collasedDiv');
}
<div class="myDiv">
// content here
</div>
<div class="myDiv">
// another content here
</div>
这不会解决切换功能的问题 - 因为它会切换每个div,而不是点击div – 2011-04-14 20:44:15
另外,由于'.appendTo'没有传递一组对象,因此它只会将给定的折叠元素追加到最后一个运行的元素上(它会每次删除/追加) – 2011-04-14 20:47:06
正确。我编辑了代码 – 2011-04-14 20:51:17