怎么实现超链接为javascript时点击后其颜色变化
日期：2014-05-17 浏览次数：20697 次
如何实现超链接为javascript时点击后其颜色变化
各位大神，救救我吧，怎样实现超链接为javascript时点击后，使其颜色变化，与其他不同。
例如，代码
<div class="type_div">
<h3>类型</h3>
<a href="javascript: load_type( '0' );">N/A</a>
<a href="javascript: load_type( '1' );">A</a>
<a href="javascript: load_type( '2' );">B</a>
<a href="javascript: load_type( '3' );">C</a>
</div>
如何使用javascript来实现点击A时把A文本的颜色变色。（CSS只对href为url的形式进行点击后改变）
------解决方案--------------------
<a href="javascript: load_type( '0' );this.style.color='#aaaaaa'">N/A</a>
其他同样的改法
------解决方案--------------------
------解决方案--------------------
各位大神，救救我吧，怎样实现超链接为javascript时点击后，使其颜色变化，与其他不同。
例如，代码
<div class="type_div">
<h3>类型</h3>
<a href="javascript: load_type( '0' );">N/A</a>
<a href="javascript: load_type( '1' );">A</a>
<a href="javascript: load_type( '2' );">B</a>
<a href="javascript: load_type( '3' );">C</a>
</div>
如何使用javascript来实现点击A时把A文本的颜色变色。（CSS只对href为url的形式进行点击后改变）
------解决方案--------------------
<a href="javascript: load_type( '0' );this.style.color='#aaaaaa'">N/A</a>
其他同样的改法
------解决方案--------------------
------解决方案--------------------
- HTML code
<style>
a.theforever_knight1:visited {color:green;}
a.theforever_knight2:visited {color:red;}
</style>
<a class="theforever_knight1" href="javascript: alert(1)">1111</a>
<a class="theforever_knight2" href="javascript: alert('A')">AAA</a>
------解决方案--------------------
------解决方案--------------------
考虑到楼主的心情，还是管管吧。但你自己去试一下CSS HACK，我卸载CHROME了，测试不了。
------解决方案--------------------
<!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>无标题文档</title>
<style type="text/css">
body{ padding:0; margin:0;}
.type_div{ margin:0; padding:0;}
.type_div a{ text-decoration:none; outline:none;}
.type_divA{ color:#000; text-decoration:none; outline:none;}
.type_divB{ color:#F00; text-decoration:none; outline:none;}
.type_divC{ color:#000; text-decoration:none; outline:none;}
</style>
<script type="text/javascript">
function setColor(){
var xA=document.getElementById("type_div").getElementsByTagName("a");
for(var i=0;i<xA.length;i++){
if(xA[i].className=="type_divA"){
xA[i].onmouseout=function(){this.className="type_divB"};
}
}
}
</script>
</head>
<body>
<div class="type_div" id="type_div">
<h3>类型</h3>
<a class="type_divA" onclick="setColor()" href="#">N/A</a>
<a class="type_divA" onclick="setColor()" href="#">A</a>
<a class="type_divC" href="#">B</a>
<a class="type_divC" href="#">C</a>
</div>
</body>
</html>
这个是最笨的方法了吧~
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
