tab切换

原创 2016年08月30日 16:21:41
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>tab</title>
	<style type="text/css">
		#title{width:300px;height: 50px;line-height:50px;background-color: #00f;text-align: center;}
		.tab{float: left;width: 100px;}
		#content{width: 300px;height: 200px;background-color: #f00;}
	</style>
</head>
<body>
	<div id="title">
		<div class="tab" onclick="changeTab(1)">页面一</div>
		<div class="tab" onclick="changeTab(2)">页面二</div>
		<div class="tab" onclick="changeTab(3)">页面三</div>
	</div>
	<div id="content">
		
	</div>
	<button onclick="page++;addList();">点击加载更多</button>
</body>
<script>
	var index = 0;
	var page=1;
	
	onload = function(){
		addList();
	} 
	function addList(){
		document.getElementById("content").innerHTML+= "<br>index:"+index+"page:"+page;
	}
	function changeTab(temp){
		document.getElementById("content").innerHTML="";
		//去后台交互
		page = 1;
		index= temp;
		addList();
	}
</script>
	

</html>


这样子我们就可以做到tab的互相切换以及加载更多了。


版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

TabActivity中某一个tab内切换activity的方法

之前写的程序要用到TabActivity,其中一个tab下有个多级列表,其实就是像“设置‘切换页面一样,倒是如果直接启动一个activity,你会发现这个activity会变成全屏的,和之前的TabA...

tab大图切换高端大气版

  • 2015-05-01 23:02
  • 1.34MB
  • 下载

Viewpager和fragment和自定义的底部Tab实现切换效果

使用自定义的底部TAB栏,Viewpager+fragment结合实现可以滑动切换,也可以点击Tab切换的效果

自动切换的tab

jquery tab切换重复使用

  • 2015-10-08 16:07
  • 35KB
  • 下载

Tab标签js切换高效率写法

干咱们java web开发这一行的,一般可能都碰到过做Tab标签切换的js功能任务,我看到很多人都喜欢用循环去控制那个置为当前显示,剩下都置为隐藏,我就很奇怪,为什么一定要使用循环去做这件事呢,如果你...

简单的tab切换

内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)