在“点击”另一个锚项时更改锚属性

时间:2014-12-12 16:53:56

标签: html html5 css3

在不使用javascript的情况下单击另一个锚定属性文本项时,可以更改一个文本项的初始锚属性吗?

示例代码:

<div class=links>
<ul>
<li>

<a href="#"onclick="MM_showHideLayers('what_we_do','','show');MM_showHideLayers('our_mission','','hide');MM_showHideLayers('who_we_are','','hide')" **class="active"**>WHAT WE DO</a> | 
</li>
<li>

<a href="#" onclick="MM_showHideLayers('who_we_are','','hide');MM_showHideLayers('our_mission','','show');MM_showHideLayers('what_we_do','','hide')" class>OUR MISSION</a> | 
</li>
<li>

<a href="#" onclick="MM_showHideLayers('our_mission','','hide');MM_showHideLayers('who_we_are','','show');MM_showHideLayers('what_we_do','','hide')" class>WHO WE ARE</a>

</li>
</ul>
</div>

我想将第一个字符串中的 class =&#34; active&#34; 属性更改为我的默认值&#34; a&#34;当用户单击其他任何文本链接时保留该属性,并保持该状态,直到再次单击它为止。

提前致谢!

1 个答案:

答案 0 :(得分:2)

我认为你需要使用javascript / jQuery它并不棘手

首先为所有链接提供相同的类,例如btn

<a href="#" class="active btn" >WHAT WE DO</a> | 
<a href="#" class="btn" >OUR MISSION</a> | 
<a href="#" class="btn" >WHO WE ARE</a>

现在添加jQuery:

$('.btn').click(function(){
     $('.btn').removeClass('active');
     $(this).addClass('active');
});

此脚本从所有锚中删除活动类,然后将其添加到已单击的锚中。

希望这有帮助