页面

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 作业
写回复
用AI写文章
8 条回复
切换为时间正序
请发表友善的回复…
发表回复
pw6965921pw 2014-03-07
  • 打赏
  • 举报
回复
引用 6 楼 Return_false 的回复:
一般这种东西,类似页面的导航,当页面转向某一标签页时,该该标签导航即为选中样式,而其他标签则是默认样式 因为导航存在于所有页面,那么你值需要在页面加载前设置当前标签为选中即可 function setTab(index) { //根据传来的index设置哪个标签选中 } 那么每个页面加载前,可以调用setTab(1); setTab(2);....以此来选中当前标签 或者你通过地址栏传值比如 1.html?tab=1 获取tab值,然后设置选中 不过推荐使用第一种方式
我想到判断url怎么写了 不过还是谢谢你们
  • 打赏
  • 举报
回复
一般这种东西,类似页面的导航,当页面转向某一标签页时,该该标签导航即为选中样式,而其他标签则是默认样式 因为导航存在于所有页面,那么你值需要在页面加载前设置当前标签为选中即可 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>


87,997

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧