Question

我对链接的onClick更改进行了大量研究，但无法找到我需要的解决方案。我有一个包含多个链接的侧栏菜单。我有一个默认类添加到我想要显示为默认的内容。但是，当我点击侧边栏中的其他链接时，我想要上一个链接＆＃34;＆＃34; cur＆＃34;要删除的课程，替换为什么，然后申请＆＃34; cur＆＃34;到新的链接。这是我的代码：

<li data-bind="attr:{'data-key':key, 'data-code':bankcode}, css: memberModel.bankCssClass($data)" data-key="工商银行" data-code="ICBC-NET-B2C" class="bank_2">
<a href="javascript:void(0)" class=""></a></li>

jQUERY：

$(function(){
    $('a').click(function(){
        $('a').removeClass('');
        $(this).addClass('cur');
    });
});

Answer 1

$(function(){
    $('a').click(function(){
        $(this).parent('li').siblings().find('a').removeClass('cur');
        $(this).addClass('cur');
    });
});

希望它能奏效：）

parent method

siblings method

Answer 2

试试这个：

$(function(){
    $('a').click(function(){
        $('li.blank-2 a').removeClass('cur');
        $(this).addClass('cur');
    });
});

如果你的其他lis也有班级空白2

Answer 3

removeClass（className）获取要删除的类的名称。所以试试这个：

$('a').removeClass('cur');

Answer 4

首先，您可以将HTML更改为此类

HTML

<!-- add a parent class (if you dit not do already) You can give it a class like parent --> 
<ul class="parent">
    <!-- give you're child also a class (and one of them is active) -->
    <li><a href="" class="child active">1</a></li>
    <li><a href="" class="child">2</a></li>
    <li><a href="" class="child">3</a></li>
</ul>

Jquery的

$(function(){
    // find you're specific group you want to click 
    $('a.child').click(function(event){
        // catch and stop the default action
        event.preventDefault();
        // find the specific parent (upstream the dom) (in this case ul with class parent)
        var $parent = $(this).closest("ul.parent");
        // search within your dom structure (downstream) for a child with a class that is active
        // and remove the class
        $parent.find("a.active").removeClass("active");
        // add the class to the clicked a 
        $(this).addClass('active');
   });
});

Answer 5

我弄清楚这是什么解决方案。我可能想分享一下。

HTML：

<ul data-bind="foreach: thirdPayBank" class="bank_list" style="height: 102px;">
                        <li data-bind="attr:{'data-key':key, 'data-code':bankcode}, css: memberModel.netbankCssClass($data), click: $root.netBankSelectBank" data-key="工商银行" data-code="ICBC" class="bank_2"><a href="javascript:void(0)" class="bank"></a></li>

                         <li data-bind="attr:{'data-key':key, 'data-code':bankcode}, css: memberModel.netbankCssClass($data), click: $root.netBankSelectBank" data-key="农业银行" data-code="ABC" class="bank_3"><a href="javascript:void(0)" class="bank"></a></li>

CSS：

.bank_list li a.cur {
            width: 198px;
            height: 48px;
            float: left;
            border: 1px solid #f0bebe;
            background: url(../images/zijin_icon.png) no-repeat -897px -188px;
        }

jQUERY：

 $(".bank").click(function(){
            $(".bank").removeClass('bankcur')     
            $(this).addClass('bankcur')
    })

结果：

使用jQUERY在href上添加链接类

5 个答案: