Js implementation of the current click on the label a color change to highlight the other label a return to the primary color

  • 2020-03-29 23:59:04
  • OfStack

When a page has multiple a tags, and the click will jump to the current page, how to achieve the click tag color highlighting, other tags to return to the primary color?

JS can be used to achieve:

Suppose the current page is "1.aspx"

1. Set the value of a tag ID:
 
<a href="1.aspx?id=1" id="1" target="_parent">""</a> 
<a href="1.aspx?id=2" id="2" target="_parent">""</a> 
<a href="1.aspx?id=3" id="3" target="_parent">""</a> 

2. Write JS method:
 
<script> 
&(document).ready(function(){ 
var id = windows.ulr.substring(windows.ulr.IndeOf("?id="),1) //Get id value
var currtA = document.getElementById(id); //Gets the currently clicked a TAB
if(currtA != null) 
currtA.style.color = "#f00"; 
}); 
</script> 

For other cases, such as clicking the a TAB page does not jump, you can write:
 
<a href="#" onclick="changeCss(this)">""</a> 

<script> 
function changeCss(obj){ 
var alist = document.getElementsByTagName("a"); 
for(var i =0;i < alist.Length;i++){ 
alist[i].style.color = "#000"; //Assign primary colors to all a tags
} 
obj.style.color = "#f00"; //Make the current label highlighted
} 
//You can also use Jquery's $("a").removecss () and addCss()
</script> 

Related articles: