网页制作问题，如何让文字链接颜色在点击之后保持不变，直到点击同页面上的另外一个链接才恢复原有颜色？
同一页面上有许多文字链接，原色是黑色点击A链接之后，A变蓝。在浏览A所链接的内容时，A是蓝色的。直到点击另一个链接B，A才变回黑色，同时B链接变蓝。如何这种实现？谢谢朋友...
同一页面上有许多文字链接，原色是黑色
点击A链接之后，A变蓝。
在浏览A所链接的内容时，A是蓝色的。
直到点击另一个链接B，A才变回黑色，同时B链接变蓝。
如何这种实现？谢谢朋友们！
用CSS 可以实现吗，还是要用到JS?
hult 你好！
用a:visited {color:#xxx} 的话，访问过的链接都会变色
但我想要效果是 当访问某个链接的时候才变色.
hult 这种效果还是不符合，谢谢你！ 展开
点击A链接之后，A变蓝。
在浏览A所链接的内容时，A是蓝色的。
直到点击另一个链接B，A才变回黑色，同时B链接变蓝。
如何这种实现？谢谢朋友们！
用CSS 可以实现吗，还是要用到JS?
hult 你好！
用a:visited {color:#xxx} 的话，访问过的链接都会变色
但我想要效果是 当访问某个链接的时候才变色.
hult 这种效果还是不符合，谢谢你！ 展开
4个回答
展开全部
从没想过要这么麻烦的去做，正好自己可能用到就写了一个，看看是你要的效果吗？我自己测试时可以的
<!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=gb2312" />
<title>无标题文档</title>
<style>
a{color:#000;}
a:hover{color:#00F;}
</style>
</head>
<body>
<a href="#">分类管理</a>
<a href="#">分类管理</a>
<a href="#">分类管理</a>
<a href="#">分类管理</a>
</body>
</html>
<script>
var A=new Object();//新建一个对象
document.onmousemove=function(){//鼠标移动事件检测
var e=event.target||event.srcElement;
if(e.tagName.toLowerCase()=='a')e.onclick=function(){
if(A.Current)A.Current.style.color='#000000';//恢复链接颜色
this.style.color='#0000FF';//单击链接颜色
A.Current=this;//设置当前连接
}
}
</script>
-----------------------------------
在FF下不支持是对象事件绑定的问题，我该个嘴简单的绑定方法，有其他的时间绑定办法自己搜一下：
<!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=gb2312" />
<title>无标题文档</title>
<style>
a{color:#000;}
a:hover{color:#00F;}
</style>
</head>
<body>
<a href="#" onclick="Do(this)">分类管理</a>
<a href="#" onclick="Do(this)">分类管理</a>
<a href="#" onclick="Do(this)">分类管理</a>
<a href="#" onclick="Do(this)">分类管理</a>
</body>
</html>
<script>
var A=new Object();//新建一个对象
function Do(e){
if(A.Current)A.Current.style.color='#000000';//恢复链接颜色
e.style.color='#0000FF';//单击链接颜色
A.Current=e;//设置当前连接
}
</script>
<!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=gb2312" />
<title>无标题文档</title>
<style>
a{color:#000;}
a:hover{color:#00F;}
</style>
</head>
<body>
<a href="#">分类管理</a>
<a href="#">分类管理</a>
<a href="#">分类管理</a>
<a href="#">分类管理</a>
</body>
</html>
<script>
var A=new Object();//新建一个对象
document.onmousemove=function(){//鼠标移动事件检测
var e=event.target||event.srcElement;
if(e.tagName.toLowerCase()=='a')e.onclick=function(){
if(A.Current)A.Current.style.color='#000000';//恢复链接颜色
this.style.color='#0000FF';//单击链接颜色
A.Current=this;//设置当前连接
}
}
</script>
-----------------------------------
在FF下不支持是对象事件绑定的问题，我该个嘴简单的绑定方法，有其他的时间绑定办法自己搜一下：
<!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=gb2312" />
<title>无标题文档</title>
<style>
a{color:#000;}
a:hover{color:#00F;}
</style>
</head>
<body>
<a href="#" onclick="Do(this)">分类管理</a>
<a href="#" onclick="Do(this)">分类管理</a>
<a href="#" onclick="Do(this)">分类管理</a>
<a href="#" onclick="Do(this)">分类管理</a>
</body>
</html>
<script>
var A=new Object();//新建一个对象
function Do(e){
if(A.Current)A.Current.style.color='#000000';//恢复链接颜色
e.style.color='#0000FF';//单击链接颜色
A.Current=e;//设置当前连接
}
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<!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=gb2312" />
<meta name="author" content="主机供应网:http://www.idclend.com/" />
<title>yyyyyyy</title>
<style type="text/css">
<!--
.blue {
COLOR: #0000FF;
}
.blue A:link {
COLOR: #0000FF;
}
.blue A:visited {
COLOR: #0000FF;
}
.blue A:hover {
COLOR: #0000FF;
}
.black {
COLOR: #000000;
}
.black A:link {
COLOR: #000000;
}
.black A:visited {
COLOR: #000000;
}
.black A:hover {
COLOR: #000000;
}
-->
</style>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="blue">
<tr>
<td <%if trim(request("Id"))=1 then
response.Write "class='black'"
else
response.Write "class='blue'"
end if%>><a href="?Id=1">aaaaaaaa</a></td>
<td <%if trim(request("Id"))=2 then
response.Write "class='black'"
else
response.Write "class='blue'"
end if%>><a href="?Id=2">bbbbbbb</a></td>
<td <%if trim(request("Id"))=3 then
response.Write "class='black'"
else
response.Write "class='blue'"
end if%>><a href="?Id=3">cccccccc</a></td>
<td <%if trim(request("Id"))=4 then
response.Write "class='black'"
else
response.Write "class='blue'"
end if%>><a href="?Id=4">ddddddd</a></td>
</tr>
</table>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="author" content="主机供应网:http://www.idclend.com/" />
<title>yyyyyyy</title>
<style type="text/css">
<!--
.blue {
COLOR: #0000FF;
}
.blue A:link {
COLOR: #0000FF;
}
.blue A:visited {
COLOR: #0000FF;
}
.blue A:hover {
COLOR: #0000FF;
}
.black {
COLOR: #000000;
}
.black A:link {
COLOR: #000000;
}
.black A:visited {
COLOR: #000000;
}
.black A:hover {
COLOR: #000000;
}
-->
</style>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="blue">
<tr>
<td <%if trim(request("Id"))=1 then
response.Write "class='black'"
else
response.Write "class='blue'"
end if%>><a href="?Id=1">aaaaaaaa</a></td>
<td <%if trim(request("Id"))=2 then
response.Write "class='black'"
else
response.Write "class='blue'"
end if%>><a href="?Id=2">bbbbbbb</a></td>
<td <%if trim(request("Id"))=3 then
response.Write "class='black'"
else
response.Write "class='blue'"
end if%>><a href="?Id=3">cccccccc</a></td>
<td <%if trim(request("Id"))=4 then
response.Write "class='black'"
else
response.Write "class='blue'"
end if%>><a href="?Id=4">ddddddd</a></td>
</tr>
</table>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
a{color:#000000;}
a:link{color:#000000;}
a:visited{color:#000000;}
a:hover{color:#000000;}
a:link{color:#000000;}
a:visited{color:#000000;}
a:hover{color:#000000;}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
用CSS 可以实现
定义一个currentlink
a.currentlink{color:#0000ff} a.currentlink:visited {color:#0000ff}
点击连接触发
function clickLink(obj){
for(var i=0; i< document.links.length;i++){
alert(document.links[i].getAttribute("href"));
}
obj.setAttribute("classname","currentlink");
}
<a href="xxx" class="" onclick="clickLink(this);">连接</a>
定义一个currentlink
a.currentlink{color:#0000ff} a.currentlink:visited {color:#0000ff}
点击连接触发
function clickLink(obj){
for(var i=0; i< document.links.length;i++){
alert(document.links[i].getAttribute("href"));
}
obj.setAttribute("classname","currentlink");
}
<a href="xxx" class="" onclick="clickLink(this);">连接</a>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
