页面

pw6965921pw 2014-03-06 05:42:37

比方说有4个页面
<a href="页面1">1</a><a href="页面2">2</a><a href="页面3">3</a><a href="页面4">4</a>
都有上面4个html
默认a标签是黑色
点击1 跳转到页面1 保证这个a标签变成绿色其他标签是黑色
点击2 跳转到页面2 保证这个a标签变成绿色其他标签是黑色
点击3 跳转到页面3 保证这个a标签变成绿色其他标签是黑色
点击4 跳转到页面4 保证这个a标签变成绿色其他标签是黑色

我想过2个方法
1 判断当前地址来决定变颜色但这样要给每个a添加不同的class 但这个方法不适合动态如果多加几个a 就没用了
2 如果绑定bind click 每次跳转页面js都要重新加载也没用

求大神给点思路

...全文

120 8 打赏收藏转发到动态举报

写回复

用AI写文章

8 条回复

切换为时间正序

请发表友善的回复…

发表回复

pw6965921pw 2014-03-07

打赏
举报

引用 6 楼 Return_false 的回复:

一般这种东西，类似页面的导航，当页面转向某一标签页时，该该标签导航即为选中样式，而其他标签则是默认样式因为导航存在于所有页面，那么你值需要在页面加载前设置当前标签为选中即可 function setTab(index) { //根据传来的index设置哪个标签选中 } 那么每个页面加载前，可以调用setTab(1); setTab(2);....以此来选中当前标签或者你通过地址栏传值比如 1.html?tab=1 获取tab值，然后设置选中不过推荐使用第一种方式

我想到判断url怎么写了不过还是谢谢你们

人生难得一只鸡 2014-03-06

打赏
举报

一般这种东西，类似页面的导航，当页面转向某一标签页时，该该标签导航即为选中样式，而其他标签则是默认样式因为导航存在于所有页面，那么你值需要在页面加载前设置当前标签为选中即可 function setTab(index) { //根据传来的index设置哪个标签选中 } 那么每个页面加载前，可以调用setTab(1); setTab(2);....以此来选中当前标签或者你通过地址栏传值比如 1.html?tab=1 获取tab值，然后设置选中不过推荐使用第一种方式

pw6965921pw 2014-03-06

打赏
举报

引用 4 楼 microlab2009 的回复:

[quote=引用 3 楼 u013913096 的回复:] 别写#哈有4个不同的页面哈。。。。你这样写每次加载新的页面都绑定的click都没了

只是给你个实现功能的代码啊自己要做成什么样子在此基础上自己改啊[/quote] 功能没实现啊我连接改成 <a href="1.html">1</a><a href="2.html">2</a><a href="3.html">3</a><a href="4.html">4</a> 这个4个页面代码都一样就是不行你这样绑定肯定不行哈一定要判断当前url判断哈

嘻哈大咖秀 2014-03-06

打赏
举报

引用 3 楼 u013913096 的回复:

别写#哈有4个不同的页面哈。。。。你这样写每次加载新的页面都绑定的click都没了

只是给你个实现功能的代码啊自己要做成什么样子在此基础上自己改啊

pw6965921pw 2014-03-06

打赏
举报

引用 1 楼 microlab2009 的回复:



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>test</title>

	<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

	<style type="text/css">
		a{color:#000}
	</style>

	<script type="text/javascript" >

		$(function(){
			$("a").each(function(){

				$(this).click(function(){
					var index = $('a').index($(this))
					$('a').not(index).css('color','#000');
					$('a').eq(index).css('color','green');
				})
			})
		})
	</script>
</head>

<body>


	<a href="#">1</a><a href="#">2</a><a href="#">3</a><a href="#">4</a>

</body>
</html>

别写#哈有4个不同的页面哈。。。。你这样写每次加载新的页面都绑定的click都没了

liuxingfffff 2014-03-06

打赏
举报

你都写成html页面。自己手动改改就可以了。如果是生成的页面，生成页面的时候把样式写上去就好了。

嘻哈大咖秀 2014-03-06

打赏
举报



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>test</title>

	<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

	<style type="text/css">
		a{color:#000}
	</style>

	<script type="text/javascript" >

		$(function(){
			$("a").each(function(){

				$(this).click(function(){
					var index = $('a').index($(this))
					$('a').not(index).css('color','#000');
					$('a').eq(index).css('color','green');
				})
			})
		})
	</script>
</head>

<body>


	<a href="#">1</a><a href="#">2</a><a href="#">3</a><a href="#">4</a>

</body>
</html>

一个很好的学生信息管理系统模板（静态页面）非常好的一个资源是一个模板，可以自己改为自己想要的页面、功能内容如下：个人中心 --我的信息 --班级信息 --短信息 --学院通知教务中心 --我的报考 --我的成绩 --我的数据学习中心 --资料下载 --学习历程财务中心 --我的财务教学中心

SlidePageView组件实现的仿微信上次使用时引导页面demo，还有SlidePageView实现的自定义的等宽和不等宽显示单元页面的demo 详情可以看我的博客http://blog.csdn.net/swadair/article/details/7529159

asp.net web应用的前端设计

PageHelper分页实例（带页面），基于Spring+Mybatis+SpringMVC后台与前台分页展示，效果和过程可见博文http://blog.csdn.net/evankaka/article/details/49452201

实现手势滑动平滑翻页，和ViewFlipper不同，能显示出拖动时的过渡效果。