table切换
// 自己加载正确路径的jQ
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
body,div,ul,ol,li,p{margin:0px;padding:0px;}
ul{border:1px solid green;list-style-type:none;}
ul li{float:left;width:100px;height:45px;line-height:45px;background:#abcdef;text-align:center;}
ul li a{text-decoration:none;}
.container{border:1px solid #abcdef;width:300px;height:200px;}
.act{background:#ff6600;}
</style>
</head>
<body>
<ul>
<li>随笔</li>
<li>素材</li>
<li>编程</li>
</ul>
<div class="container">
<div>这是第一个</div>
<div style="display:none;">这是第二个</div>
<div style="display:none;">这是第三个</div>
</div>
<script src="js/jquery-1.11.3.js"></script>
<script>
$(function(){
$("ul li").each(function(){
var index=$(this).index();
$("ul li").eq(0).addClass("act");
$(this).click(function(){
$(this).addClass("act").siblings().removeClass("act");
$(".container>div").eq(index).stop(true).show().siblings().stop(true).hide();
})
})
})
</script>
</body>
</html>
table切换的更多相关文章
- swiper (Table切换和动态加载时候出现的问题)
本文为让心灵-去旅行原创,转载请说明.. 我们在写一个简单的swiper图片轮播的时候很简单,是写死的也就那么几张图片轮播.如果这时候图片和一些东西是后台的,你从js里动态添加到DOM时,这时候你就会 ...
- delphi Table切换控件顺序问题
delphi Table切换控件顺序问题 Tagorder的值就是确定Table键切换顺序的 以上做法只能解决同一类型的多个控件(如Edit1,edit2....)显示顺序问题 假如有不同类型的控件如 ...
- vue的table切换
HTML: <div id="box"> <ul> <li v-for="(item,index) in items" v-tex ...
- selenium常用api之切换:table切换、alert弹框切换、iframe框架切换
10.查看浏览器打开了多少个table和当前页面在哪个table 测试:打开了浏览器后,打开了一个新的标签页之后,显示此时有2个table,浏览器中当前页面展示的是第2个页面,但是代码打印显示的仍然是 ...
- JavaScript 几种简单的table切换
方法一:for循环+if判断当前点击与自定义数组是否匹配 <!DOCTYPE html> <html lang="en"> <head> < ...
- JS几种table切换
1.使用className <!doctype html> <html lang="en"> <head> <meta charset=& ...
- element table切换分页不勾选的自带方法
场景一:没有回显勾选的情况 table表格加row-key标识选中行唯一标识,多选框加reserve-selection设置为true <template> <el-table v- ...
- 多个table切换 getElementsByClassName
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...
- table切换jquery插件 jQuery插件写法模板 流程
通过$.extend()来扩展jQuery 通过$.fn 向jQuery添加新的方法 通过$.widget()应用jQuery UI的部件工厂方式创建 通过$.extend()来扩展jQuery $. ...
随机推荐
- 测试工作中ADB命令实战
作者:TT,<测试架构师>微信公众号作者 大家能点击进来,说明还是对ADB有所了解或听说过的,可能也会比较熟练的掌握了这些命令,下面描述如有不对的地方,欢迎指正和交流学习,请多指教! 一. ...
- DevExpress 控件使用之GridControl基本属性设置
DEV控件:gridControl常用属性设置 1.隐藏最上面的GroupPanel(实现方法两种) ①代码实现:gridView1.OptionsView.ShowGroupPane ...
- 新手学js的效果图1---( 淘宝等商城货物查看特效)
本人结合之前所学一起写了,多个特效,只是新手自己瞎鼓捣的,思路清晰,具体实现的货物放大镜等,替换当中的img地址就可以查看特效 <!DOCTYPE html> <html lang= ...
- CSS3弹性盒模型新版和老版写法差异
1.在使用弹性盒模型的时候父元素必须要加display:box 或 display:inline-box: 新版弹性盒模型:flex:display : flex 老版弹性盒模型:box : disp ...
- Redis服务器搭建
下载并解压redis,然后进入redis所在目录 编译安装 make && make install 启动redis 服务 (加上&表示在后台运 ...
- JSP中三种弹出对话框的用法《转》
对话框有三种 1:只是提醒,不能对脚本产生任何改变: 2:一般用于确认,返回 true 或者 false ,所以可以轻松用于 if...else...判断 3: 一个带输入的对话框,可以返回用户填入的 ...
- Redis 安装与初体验
一.Redis简介 Redis是一个key-value存储系统.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).list(链表).set(集合).zset(s ...
- canvas随笔
公司刚刚处于创业初期,总是会尝试着做一些新奇的东西.尤其是对于网上一些好玩的东西,总是希望自己也能有一样的功能.不得不说,对于我来说,既是种机遇,也是种挑战.因为这样给了我足够的发展空间,可以按着自己 ...
- 查看iis对应w3wp.exe显示的进程ID号(转载)
管理员身份运行cmd,跳转到C:\Windows\System32\inetsrv目录,然后运行appcmd list wp即可查看
- [lua] mac上如何编译snapshot(检测Lua中的内存泄露)
最近我们的unity手游频繁闪退,只要进入战斗场景,之后一段时间就会闪退,如果是在unity编辑器中则会报出not enough memory的错误!猜测应该是有内存泄漏: 由于我们使用了tolua, ...