Heim > Web-Frontend > js-Tutorial > Js实现当前点击a标签变色突出显示其他a标签回复原色_javascript技巧

Js实现当前点击a标签变色突出显示其他a标签回复原色_javascript技巧

WBOY
Freigeben: 2016-05-16 17:12:11
Original
1647 Leute haben es durchsucht

当一个页面有多个a标签,且点击后会跳转至当前页面,如何实现被点击标签变色突出显示,其他标签回复原色呢?

利用JS可实现:

假设当前页面是“1.aspx”

1. 给a标签ID设值:

复制代码 代码如下:

""
""
""

2. 写JS方法:
复制代码 代码如下:

<script> <BR>&(document).ready(function(){ <BR>var id = windows.ulr.substring(windows.ulr.IndeOf("?id="),1) //取得id值 <BR>var currtA = document.getElementById(id); //取得当前被点击a标签 <BR>if(currtA != null) <BR>currtA.style.color = "#f00"; <BR>}); <BR></script>

对于其他情况,如点击a标签页面不跳转,则可以这样写:
复制代码 代码如下:

""

<script> <BR>function changeCss(obj){ <BR>var alist = document.getElementsByTagName("a"); <BR>for(var i =0;i < alist.Length;i++){ <BR>alist[i].style.color = "#000"; //给所有a标签赋原色 <BR>} <BR>obj.style.color = "#f00"; //令当前标签高亮 <BR>} <BR>//当然也可以用Jquery的$("a").removeCss() 和addCss()来实现 <BR></script>
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage