请教怎么取得“层”下，div样式名个数
日期：2014-05-16 浏览次数：20363 次
请问如何取得“层”下，div样式名个数？
我页面的结构是这样子的：
<div class="层1">
<div class="content07"></div>
<div class="content07"></div>
<div class="content07"></div>
<div>展开按钮1</div>
</div>
<div class="层2">
<div class="content07"></div>
<div class="content07"></div>
<div class="content07"></div>
<div class="content07"></div>
<div class="content07"></div>
<div>展开按钮2</div>
</div>
<div class="层3">
<div class="content07"></div>
<div class="content07"></div>
<div>展开按钮3</div>
</div>
请问这种效果能否实现，就是
默认“层2”、“层3”的高度为0，当点击“展开按钮1”的时候，算出“层2”中“content07”的个数，之后用个数乘上每行固定高度75px，得出“层2”的高度使其撑开（“层3”的效果一样，并且“层”的个数不定，可能会很多）
这其实就是个点击展开的效果，可是用display：none的方法，和我页面中另外一段代码有冲突，固在这里求教，谢谢！
------解决方案--------------------
感觉你就是想做类似菜单，或者叫滑块的东西，给你做了个，给分全看自觉啊~~
我页面的结构是这样子的：
<div class="层1">
<div class="content07"></div>
<div class="content07"></div>
<div class="content07"></div>
<div>展开按钮1</div>
</div>
<div class="层2">
<div class="content07"></div>
<div class="content07"></div>
<div class="content07"></div>
<div class="content07"></div>
<div class="content07"></div>
<div>展开按钮2</div>
</div>
<div class="层3">
<div class="content07"></div>
<div class="content07"></div>
<div>展开按钮3</div>
</div>
请问这种效果能否实现，就是
默认“层2”、“层3”的高度为0，当点击“展开按钮1”的时候，算出“层2”中“content07”的个数，之后用个数乘上每行固定高度75px，得出“层2”的高度使其撑开（“层3”的效果一样，并且“层”的个数不定，可能会很多）
这其实就是个点击展开的效果，可是用display：none的方法，和我页面中另外一段代码有冲突，固在这里求教，谢谢！
------解决方案--------------------
感觉你就是想做类似菜单，或者叫滑块的东西，给你做了个，给分全看自觉啊~~
- JScript code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<style type="text/css">
.d1{border: #E3E3E3 thin solid;background-color:#99CCCC;}
.d2{border: #E3E3E3 thin solid;background-color:#99CC99;}
.d3{border: #E3E3E3 thin solid;background-color:#9999CC;}
.title{background-color:#99CCCC; height:40px;}
.content07{border: #E3E3E3 thin solid;background-color:#9999CC; height:75px;display:none;}
</style>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".d1,.d2,.d3").click(function(){
$(this).find("div[class='content07']").slideToggle("slow");
});
});
</script>
</HEAD>
<BODY>
<div class="d1">
<div class="title">d1</div>
<div class="content07">content07</div>
<div class="content07">content07</div>
<div class="content07">content07</div>
</div>
<div class="d2">
<div class="title">d2</div>
<div class="content07">content07</div>
<div class="content07">content07</div>
<div class="content07">content07</div>
<div class="content07">content07</div>
<div class="content07">content07</div>
</div>
<div class="d3">
<div class="title">d3</div>
<div class="content07">content07</div>
<div class="content07">content07</div>
</div>
</BODY>
</HTML>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
