时间戳

首页 > 解决方案 > 使用 Jquery 单击链接时将链接变灰

javascript - 使用 Jquery 单击链接时将链接变灰

问题描述

您好，我是 JQuery 的新手，并且已经知道如何制作一个可以在单击链接时隐藏和显示的 div 列表。现在我希望当前单击的链接变灰。我非常不确定如何做到这一点。
我也是松弛溢出的新手，所以如果我没有正确回答这个问题，请告诉我我没有发布足够多的代码。

jQuery

jQuery(function () {
    jQuery('#showall').click(function () {
        jQuery('.targetDiv').show();
    });
    jQuery('.showSingle').click(function () {
        jQuery('.targetDiv').hide();
        jQuery('#div' + $(this).attr('target')).show();
    });
});

链接菜单

 <a class="showSingle" target="1">Div1</a>           
   <h1 class="title">Heading</h1>
   <a class="showSingle" target="2">Div2</a>
   <a class="showSingle" target="3">Div3</a>
   <a class="showSingle" target="4">Div4</a>

要切换的 div

         <div id="div2" class="targetDiv" style="display:none">Div2</div>
         <div id="div3" class="targetDiv" style="display:none">Div3</div>
         <div id="div4" class="targetDiv" style="display:none">Div4</div>

标签： javascriptjqueryhtmlcss

解决方案

使用 $(this) 来定位点击的链接。

jQuery(function () {
    jQuery('#showall').click(function () {
        jQuery('.targetDiv').show();
    });
    jQuery('.showSingle').click(function () {
        jQuery('.targetDiv').hide();
        jQuery(this).addClass('className');
        jQuery('#div' + $(this).attr('target')).show();
    });
});

这样，当单击链接时，将添加类。

推荐阅读