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 相关文章推荐
常用参考资料(手册)下载或者链接
Jul 22 Javascript
js下弹出窗口的变通
Apr 18 Javascript
一个js控制的导航菜单实例代码
Dec 03 Javascript
JavaScript实现倒计时代码段Item1(非常实用)
Nov 03 Javascript
JavaScript代码生成PDF文件的方法
Feb 26 Javascript
微信小程序实现图片预览功能
Jan 31 Javascript
vue input输入框模糊查询的示例代码
May 22 Javascript
Vue+webpack+Element 兼容问题总结(小结)
Aug 16 Javascript
从零开始学习搭建React脚手架项目
Aug 23 Javascript
详解Node.js 中使用 ECDSA 签名遇到的坑
Nov 26 Javascript
详解微信小程序开发用户授权登陆
Apr 24 Javascript
微信小程序单选框自定义赋值
May 26 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之uniqid()函数用法
2014/11/03 PHP
Laravel使用模型实现like模糊查询的例子
2019/10/24 PHP
laravel框架中路由设置,路由参数和路由命名实例分析
2019/11/23 PHP
禁止IE用右键的JS代码
2013/12/30 Javascript
jQuery实现列表自动滚动循环滚动展示新闻
2014/08/22 Javascript
JavaScript监听和禁用浏览器回车事件实例
2015/01/31 Javascript
javascript获取重复次数最多的字符
2015/07/08 Javascript
JavaScript如何获取数组最大值和最小值
2015/11/18 Javascript
基于JavaScript代码实现随机漂浮图片广告
2016/01/05 Javascript
简单谈谈json跨域
2016/03/13 Javascript
JavaScript实现简易的天数计算器实例【附demo源码下载】
2017/01/18 Javascript
AngularJS前端页面操作之用户修改密码功能示例
2017/03/27 Javascript
NodeJS链接MySql数据库的操作方法
2017/06/27 NodeJs
浅谈express 中间件机制及实现原理
2017/08/31 Javascript
JS实现的tab页切换效果完整示例
2018/12/18 Javascript
JS实现数组去重及数组内对象去重功能示例
2019/02/02 Javascript
小程序云函数调用API接口的方法
2019/05/17 Javascript
vue+axios实现post文件下载
2019/09/25 Javascript
[02:44]DOTA2英雄基础教程 钢背兽
2013/12/19 DOTA
[02:55]2018DOTA2国际邀请赛勇士令状不朽珍藏Ⅲ饰品一览
2018/08/01 DOTA
仅用50行代码实现一个Python编写的计算器的教程
2015/04/17 Python
Python使用剪切板的方法
2017/06/06 Python
Python cookbook(数据结构与算法)通过公共键对字典列表排序算法示例
2018/03/15 Python
解决Pandas to_json()中文乱码,转化为json数组的问题
2018/05/10 Python
python爬虫之模拟登陆csdn的实例代码
2018/05/18 Python
python networkx 包绘制复杂网络关系图的实现
2019/07/10 Python
python实现大学人员管理系统
2019/10/25 Python
Python OrderedDict的使用案例解析
2019/10/25 Python
python实现LRU热点缓存及原理
2019/10/29 Python
在Keras中实现保存和加载权重及模型结构
2020/06/15 Python
学习Python需要哪些工具
2020/09/04 Python
澳大利亚床上用品、浴巾和家居用品购物网站:Bambury
2020/04/16 全球购物
什么是数组名
2012/05/10 面试题
采购意向书范本
2014/03/31 职场文书
合同审查法律意见书
2015/06/04 职场文书
vue实力踩坑之push当前页无效
2022/04/10 Vue.js