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 相关文章推荐
js 多浏览器分别判断代码
Apr 01 Javascript
关于javascript中的typeof和instanceof介绍
Dec 04 Javascript
js实现字符串的16进制编码不加密
Apr 25 Javascript
js实现鼠标经过时图片滚动停止的方法
Feb 16 Javascript
jquery控制显示服务器生成的图片流
Aug 04 Javascript
浅谈bootstrap使用中的一些问题以及解决过程
Oct 18 Javascript
JS生成和下载二维码的代码
Dec 07 Javascript
基于Angular.js实现的触摸滑动动画实例代码
Feb 19 Javascript
使用jQuery卸载全部事件的思路详解
Apr 03 jQuery
vuejs使用$emit和$on进行组件之间的传值的示例
Oct 04 Javascript
vue中img src 动态加载本地json的图片路径写法
Apr 25 Javascript
js属性对象的hasOwnProperty方法的使用
Feb 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实现 使用PHP数组内部指针操作函数
2010/10/12 PHP
PHP查询MySQL大量数据的时候内存占用分析
2011/07/22 PHP
PHP截取指定图片大小的方法
2014/12/10 PHP
详解Yii2高级版引入bootstrap.js的一个办法
2017/03/21 PHP
ThinkPHP3.2框架自定义配置和加载用法示例
2018/06/14 PHP
浅析JavaScript基本类型与引用类型
2014/05/28 Javascript
Js为表单动态添加节点内容的方法
2015/02/10 Javascript
JavaScript实现前端分页控件
2017/04/19 Javascript
Node.js  事件循环详解及实例
2017/08/06 Javascript
详谈vue+webpack解决css引用图片打包后找不到资源文件的问题
2018/03/06 Javascript
全面了解JavaScript的作用域链
2019/04/03 Javascript
移动端底部导航固定配合vue-router实现组件切换功能
2019/06/13 Javascript
jQuery属性选择器用法实例分析
2019/06/28 jQuery
vue指令v-html使用过滤器filters功能实例
2019/10/25 Javascript
vue项目强制清除页面缓存的例子
2019/11/06 Javascript
Vue-cli3生成的Vue项目加载Mxgraph方法示例
2020/05/31 Javascript
js代码编写无缝轮播图
2020/09/13 Javascript
前端vue+elementUI如何实现记住密码功能
2020/09/20 Javascript
[43:48]Ti4正赛第一天 VG vs NEWBEE 2
2014/07/19 DOTA
简单理解Python中的装饰器
2015/07/31 Python
python socket多线程通讯实例分析(聊天室)
2016/04/06 Python
Python 正则表达式入门(中级篇)
2016/12/07 Python
Python + selenium + requests实现12306全自动抢票及验证码破解加自动点击功能
2018/11/23 Python
python检测IP地址变化并触发事件
2018/12/26 Python
用Python配平化学方程式的方法
2019/07/20 Python
CSS3 实现的缩略图悬停效果
2020/12/09 HTML / CSS
伦敦所有西区剧院演出官方票务代理:Theatre Tickets Direct
2017/05/26 全球购物
澳大利亚宠物食品和药物在线:Jumbo Pets
2018/03/24 全球购物
应届医学毕业生求职信分享
2013/12/02 职场文书
公务员转正考察材料
2014/02/07 职场文书
水利水电建筑施工应届生求职信
2014/07/04 职场文书
幼儿园教师师德师风演讲稿:爱我所爱 无悔青春
2014/09/10 职场文书
推荐信范文大全
2015/03/27 职场文书
赤壁观后感(2)
2015/06/15 职场文书
python Tkinter的简单入门教程
2021/04/11 Python
Python max函数中key的用法及原理解析
2021/06/26 Python