jquery控制页面的展开和隐藏实现方法(推荐)


Posted in Javascript onOctober 15, 2016

【jquery代码】 

<script> 
      require(["jquery","validate","bootstrap","lhgcalendar"],function($) { 
        $(function(){   
          $("form").validate(); 
        }); 
    
        $(".up").click(function(){ 
          $(this).parent().parent().parent().parent().next().slideToggle("slow"); 
        }); 
       }); 
 </script>

【HTML代码】

<div class="panel panel-default"> 
<table class="table table-bordered"> 
  <thead> 
<tr class=" active" id="a3"> 
  <th width="15%" style="text-align:center;">加盟状态</th> 
  <th width="25%" style="text-align:center;">申请表名称</th> 
  <th width="25%" style="text-align:center;">审核情况</th> 
  <th width="25%" style="text-align:center;">操作</th> 
  <th width="10%" style="text-align:center;">隐藏/展开切换</th> 
</tr> 
  </thead> 
  <tbod> 
<tr style="text-align:center;" class=" active"> 
  <td><strong class="text-warning">第1步:<? echo $stage->name;?></strong></td> 
  <td><a href="#">《信息表》</a></td> 
  <td>-</td> 
  <td>-</td> 
  <td> 
<span class="up text-info" ><i class="glyphicon glyphicon-chevron-down"style="padding:0px 5px 0 5px;"></i></span> 
  </td> 
</tr> 
  </tbody> 
</table> 
<div class="panel-body" style="display:none;"> 
  <table class="table"> 
<tbody> 
  <tr> 
    <td>-</td>  
    <td>-</td><pre name="code" class="html">    <td>-</td>  
  </tr>  
</tbody>  
  </table> 
</div>  
</div>

以上就是小编为大家带来的jquery控制页面的展开和隐藏实现方法(推荐)全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
jQuery select控制插件
Aug 17 Javascript
javascript 三种编解码方式
Feb 01 Javascript
jQuery ctrl+Enter shift+Enter实现代码
Feb 07 Javascript
Javascript面向对象之四 继承
Feb 08 Javascript
JavaScript常用判断写法大全(推荐)
May 30 Javascript
BootStrap使用file-input插件上传图片的方法
Sep 05 Javascript
JS实现的几个常用算法
Nov 12 Javascript
js实现日历与定时器
Feb 22 Javascript
jquery.validate表单验证插件使用详解
Jun 21 jQuery
写gulp遇到的ES6问题详解
Dec 03 Javascript
layui 阻止图片上传的实例(before方法)
Sep 26 Javascript
Ajax实现三级联动效果
Oct 05 Javascript
JS常用函数和常用技巧小结
Oct 15 #Javascript
表单元素值获取方式js及java方式的简单实例
Oct 15 #Javascript
JS添加或修改控件的样式(Class)实现方法
Oct 15 #Javascript
原生JS实现的放大镜效果实例代码
Oct 15 #Javascript
jQuery通过ajax方法获取json数据不执行success的原因及解决方法
Oct 15 #Javascript
Bootstrap分页插件之Bootstrap Paginator实例详解
Oct 15 #Javascript
jstl中判断list中是否包含某个值的简单方法
Oct 14 #Javascript
You might like
PHP中让curl支持sock5的代码实例
2015/01/21 PHP
10个值得深思的PHP面试题
2016/11/14 PHP
解决出现SoapFault (looks like we got no XML document)的问题
2017/06/24 PHP
安装docker和docker-compose实例详解
2019/07/30 PHP
Javascript 加载和执行-性能提高篇
2012/12/28 Javascript
关于eval 与new Function 到底该选哪个?
2013/04/17 Javascript
多种方法实现JS动态添加事件
2013/11/01 Javascript
JS检测输入字符是否包含非法字符的示例代码
2014/02/11 Javascript
详细解读JavaScript编程中的Promise使用
2015/07/27 Javascript
JQuery核心函数是什么及使用方法介绍
2016/05/03 Javascript
Angular中实现树形结构视图实例代码
2017/05/05 Javascript
详谈javascript精度问题与调整
2017/07/08 Javascript
vue watch自动检测数据变化实时渲染的方法
2018/01/16 Javascript
浅谈ajax在jquery中的请求和servlet中的响应
2018/01/22 jQuery
详解微信小程序之一键复制到剪切板
2019/04/24 Javascript
vue中的过滤器及其时间格式化问题
2020/04/09 Javascript
[02:32]“虐狗”镜头慎点 2016国际邀请赛中国区预选赛现场玩家采访
2016/06/28 DOTA
[27:08]完美世界DOTA2联赛PWL S2 SZ vs Rebirth 第二场 11.21
2020/11/23 DOTA
python smtplib模块发送SSL/TLS安全邮件实例
2015/04/08 Python
Python中logging.NullHandler 的使用教程
2018/11/29 Python
python hbase读取数据发送kafka的方法
2018/12/27 Python
Django中使用Whoosh进行全文检索的方法
2019/03/31 Python
基于python实现从尾到头打印链表
2019/11/02 Python
使用pickle存储数据dump 和 load实例讲解
2019/12/30 Python
python 星号(*)的多种用途
2020/09/21 Python
基于 HTML5 WebGL 实现的垃圾分类系统
2019/10/08 HTML / CSS
什么是托管函数?托管函数有什么用?
2014/06/15 面试题
护士实习生自我鉴定范文
2013/12/10 职场文书
应用英语专业自荐信
2014/01/26 职场文书
食品安全检查制度
2014/02/03 职场文书
上课说话检讨书
2015/01/27 职场文书
投诉书格式范本
2015/07/02 职场文书
写给同事的离职感言
2015/08/04 职场文书
周一早安温馨问候祝福语!
2019/07/15 职场文书
公务员的复习计划书,请收下!
2019/07/15 职场文书
mysql中数据库覆盖导入的几种方式总结
2022/03/25 MySQL