Question

我的任务是单击一个HREF列表项，使其变为粗体并使其他项正常。 Todo这个我需要执行一个简单的类开关。我目前在检查中没有错误，它什么也没做。服务器标签（asp：超链接等同于href）会有所不同吗？这是我的代码......

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="SmuSideNavigationSublayout.ascx.cs" Inherits="SmuSideNavigation.layouts.ProjectX.sublayouts.SmuSideNavigationSublayout" %>

<style type="text/css">

    .selected_Turn {
        font-weight: normal;
    }

    .selected_Turn_on {
        font-weight: bold;
    }
</style>


<div id="smuSideNav" class="selTurn">
    <ul class="nav nav-list">
        <li class="nav-header home"><asp:HyperLink runat="server" ID="hypParent" CssClass="selected_Turn"/></li>
        <asp:Repeater ID="Repeater1" runat="server">
            <ItemTemplate>
                <li><asp:HyperLink runat="server" ID="hypChild" CssClass="selected_Turn"/></li>
            </ItemTemplate>
        </asp:Repeater>
    </ul>
</div> 


<script type="text/javascript">
    jQuery('.selTurn a').click(function () {
        jQuery('.selTurn a').removeAttr('class'); // remove all classes
        jQuery(this).attr('class', this.className + "_on");
    });
</script>

Answer 1

您应该尝试使用jquery addClass（）toggleClass（）和removeClass（）方法，而不是处理属性。我相信toggleClass（）会做你想要的。

Answer 2

您的所有锚点都有selected_Turn类。只需向其添加一个点击处理程序，即可将selected_Turn_on从其他处理程序中删除，并将其添加到点击的处理程序中。最后添加的类将覆盖默认的selected_Turn类的font-weight属性。

$('.selected_Turn').click(function () {
    $('.selected_Turn').removeClass('selected_Turn_on');
    $(this).addClass('selected_Turn_on');
});

Answer 3

看起来您首先删除所有类属性： jQuery('.selTurn a').removeAttr('class'); // remove all classes

然后您尝试附加到这些类属性： jQuery(this).attr('class', this.className + "_on");

我的猜测与点击功能中this发生的事情有关......

在HREF上单击动态切换css类

3 个答案: