• 怎么用js或jq点击展开,出现隐藏的DIV,点击收起DIV又隐藏起来.


    方法一:
    1
    <script type="text/javascript"> 2 $(function() { 3 $("#toggle").click(function() { 4 $(this).text($("#content").is(":hidden") ? "收起" : "展开"); 5 $("#content").slideToggle(); 6 }); 7 }); 8 </script>
    1 <a href="#" id="toggle">展开</a>
    2 <div id="content" style="display: none;"><p>隐藏内容<p><p>隐藏内容<p></div>

    方法二:

     1 <script>
     2 /*展开和收起用一个div,也可以说它是个按钮,假设它的id=d1;
     3 假设需要显示和隐藏的div叫d2;
     4 下面这段代码只是粗略的实现了你的要求,主要是给你提供个思路;
     5 */
     6 $(function(){
     7 $('#d1').click(function(){//给d1绑定一个点击事件;
     8             
     9         /*这个判断的意义是,如果d2是隐藏的,那么让它显示出来,并将d1的文本内容替换成收起,
    10         如果是显示的,那么就隐藏它并将d1的文本内容替换为展开;*/
    11         if($('#d2').is(':hidden'))
    12         {
    13           $('#d2').slideDown('slow');  
    14           $(this).text('收起');
    15         }else{
    16           $('#d2').slideUp('slow');
    17           $(this).text('展开');  
    18             }
    19                 
    20     /*这是一个很简单的事件处理,如果还需要跟上图片的变换,就在判断的对应位置写入图片或者背景变换的代码,*/
    21 });
    22 });
    23 </script>
    24 <div id='d1'>展开</div>
    25 <div id='d2' style=" display:none">内容</div>
  • 相关阅读:
    WEB前端开发规范文档
    MySQL笔记系列:数据库概述
    MySQL笔记系列:MySQL架构
    Centos6.4中Apache,MySQL,PHP 的安装
    Linux面试总结分享
    NFS网络文件共享服务介绍及案例
    Linux命令(7):cp
    Linux命令(6):cat
    Linux命令(5):vi
    Linux命令(4):touch
  • 原文地址:https://www.cnblogs.com/haonanZhang/p/6282419.html
Copyright © 2020-2023  润新知