MyException - 我的异常网
当前位置:我的异常网» JavaScript » 如何用JS控制多个DIV的显示和隐藏有关问题

如何用JS控制多个DIV的显示和隐藏有关问题

www.myexceptions.net  网友分享于:2013-04-10  浏览:229次
怎么用JS控制多个DIV的显示和隐藏问题
<DIV class="lsoftware-summary ztfontcolorx" id="testD">
<UL class="clearfix">
  <ul>
    <li class="lbianhao">246456991</li>
  </ul> 
  <LI class="lmingcheng"> 返回山东分公司阿飞噶地方噶的噶业循环冷却水中游离氯和总氯的测定 N,N--二乙基--1,4--苯二胺分光光度法 啊啊啊 
</LI>
  <LI class="lbumen">阿斯顿发送到</LI>
  <LI class="lriqi">2001-06-01</LI>
  <LI class="lzhuangtai">即将实施</LI>
</UL>
</DIV>
<DIV class="lsoftware-summary ztfontcolorx" id="testD">
<UL class="clearfix">
  <ul>
    <li class="lbianhao">541991</li>
  </ul> 
  <LI class="lmingcheng"> 阿斯顿噶是的请问而气温打发鬼地方是打发似的</LI>
  <LI class="lbumen">阿斯顿发</LI>
  <LI class="lriqi">2001-06-01</LI>
  <LI class="lzhuangtai">即将实施</LI>
</UL>
</DIV>


<DIV class="lsoftware-summary ztfontcolorj" id="testV">
<UL class="clearfix">
  <ul>
    <li class="lbianhao">HG/T 20623-1991</li>
  </ul> 
  <LI class="lmingcheng"> 阿迪噶地方大范甘迪发广东省阿斯顿法师打发阿斯顿发</LI>
  <LI class="lbumen">阿士大夫</LI>
  <LI class="lriqi">2001-06-01</LI>
  <LI class="lzhuangtai">即将实施</LI>
</UL>
</DIV>

<DIV class="lsoftware-summary ztfontcolorg" id="testE">
<UL class="clearfix">
  <ul>
    <li class="lbianhao">2655555</li>
  </ul> 
  <LI class="lmingcheng"> 56464阿斯顿法师打发阿斯顿发送到</LI>
  <LI class="lbumen">阿斯顿发</LI>
  <LI class="lriqi">2001-06-01</LI>
  <LI class="lzhuangtai">即将实施</LI>
</UL>
</DIV>
如上,总共有三类div,id分为三类,testD,testV,testE,各类div的个数不一定,我进举了四个div,一页可能有好几个,现在我想用按钮和js来实现点击某一个按钮隐藏某一类div,再点击又显示某一类div
,这个有什么办法实现吗?
div显示

------解决方案--------------------
相同类型的div加一个class, 比如你的第一个div就是改成<DIV class="lsoftware-summary ztfontcolorx divA" id="testD"> ,现在你这个div继承了三个类lsoftware-summary、ztfontcolorx和divA

js脚本如下(需要引入jQuery库):

$('#btnId').click(function(){   //#btnId是你的按钮的id,你要根据实际替换
         $('.divA').hide();     //或者 $('.divA').show(); 
});

这样就可以达到通过按钮控制某一类(如divA)元素的隐藏/显示
------解决方案--------------------
说实话没太多时间细看,不过getElementsByTagName(name)这个function可以获取所有div,然后你再按照你的逻辑循环判断吧,应该没问题的.
------解决方案--------------------
你一个按钮对应一个ID即可
<button type="button" onclick="fun('testD')">testD</button>
<button type="button" onclick="fun('testV')">testV</button>
<button type="button" onclick="fun('testE')">testE</button>
<script type="text/javascript">
    function fun(id){
        //$("#"+id).toggle();//jquery写法

文章评论

软件开发程序错误异常ExceptionCopyright © 2009-2015 MyException 版权所有