Heim > Web-Frontend > HTML-Tutorial > a标签点击跳转页面后怎么给当前点击的a标签用jquery添加一个样式_html/css_WEB-ITnose

a标签点击跳转页面后怎么给当前点击的a标签用jquery添加一个样式_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 11:20:53
Original
2885 Leute haben es durchsucht

a标签点击跳转页面后怎么给当前点击的a标签用jquery添加一个样式如图 ,点击当前a标签跳转页面后给当前a标签添加一个样是

div class="footer">  <ul width="100%" border="0" style="text-align: center;">            <li class="ditia"><a class="currentA"><img  src="images/home-2.png" / alt="a标签点击跳转页面后怎么给当前点击的a标签用jquery添加一个样式_html/css_WEB-ITnose" ><div>首页</div></a></li>              <li class="ditia"><a href="product.html"><img  src="images/list-1.png"/ alt="a标签点击跳转页面后怎么给当前点击的a标签用jquery添加一个样式_html/css_WEB-ITnose" > <div>产品中心</div></a></li>                <li class="ditia"><a href="news.html"><img  src="images/news-1.png"/ alt="a标签点击跳转页面后怎么给当前点击的a标签用jquery添加一个样式_html/css_WEB-ITnose" > <div>动态</div></a></li>                      <li class="ditia"><a href="aboutUs.html"><img  src="images/call-1.png"/ alt="a标签点击跳转页面后怎么给当前点击的a标签用jquery添加一个样式_html/css_WEB-ITnose" > <div>联系我们</div></a></li>        </ul></div>
Nach dem Login kopieren


回复讨论(解决方案)

a:visited

a:visited

这样不行吧,点击过后当前的a标签的样式就变了,当点击另一个的时候上一个a标签又恢复原样了,当前点的那个又变了

var $lastLi = $('.footer ul:last');
$lastLi.addClass("active-ditia");
$lastLi.find('img').attr("src","图片地址");

.active-ditia的CSS定义:
.active-ditia a{
color:'#FE6100';
}

看看是否可行?

var $lastLi = $('.footer ul li:last');
$lastLi.addClass("active-ditia");
$lastLi.find('img').attr("src","图片地址");

.active-ditia的CSS定义:
.active-ditia{
color:'#FE6100';
}

2#写错了。

有几种办法:
1. 用cookie记录这个打开的序列号,然后页面在跳转的时候在读出来。
2. 循环a的链接,然后与location.href去比对,如果相同,或包含有同样字符串序列,则添加className.
3. 给每个页面写一个页面的id值,然后每次判断,有值则addClass

有几种办法:
1. 用cookie记录这个打开的序列号,然后页面在跳转的时候在读出来。
2. 循环a的链接,然后与location.href去比对,如果相同,或包含有同样字符串序列,则添加className.
3. 给每个页面写一个页面的id值,然后每次判断,有值则addClass

你说的第二个方法求个详解,觉得这个不错

问题是解决了

 $(document).ready(function () {            $('.footer li a').each(function () {                if ($($(this))[0].href == String(window.location))                    $(this).addClass('currentA').attr('href', 'javascript:void(0);');            });        })
Nach dem Login kopieren

对比地址栏的值  直接赋 class

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