使用jquery更改母版页元素的css

Question

当我在任何子链接页面上时，我都想突出显示主菜单。

为此，我试图将css应用于主页面的主菜单链接。

菜单代码如下：

 <div class="menu">
                 <ul id="vertical-navigation">
                    <li runat="server" id="liConfiguration" class="main_link"><a href="#">Configuration</a>
                        <ul>
                            <li class="">
                                <div class="ParentMenu">
                                    <div class="ChildItem">
                                        <asp:HyperLink ID="HyperLink5" runat="server" NavigateUrl="~/xyz/xyz.aspx">xyz Master</asp:HyperLink></div>
                                    <iframe src="" class="IframeMenuItem" scrolling="no"></iframe>
                                </div>
                            </li>

因此，在这种情况下，当我转到xyz.aspx时，我想将"liConfiguration"的css更改为"active_butn"

我想写一个jquery函数来更改css。。。我该怎么做？

Answer 1

尽管您要求使用jquery代码（有两个答案），但我认为服务器代码可能会更好。当您可能想要更改元素id时，它会更安全。

在主机中：

public void ChangeConfigurationElementClass(string className)
{
    liConfiguration.Attributes["class"] = className;
}

页面中：

var master = Master as MyMaster;
if (master != null)
    master.ChangeConfigurationElementClass("active_butn");

Answer 2

var $path = window.location.pathname;
var $indexPath = function ($path) {
            if ($path.indexOf('xyz') > -1) {
                $('#liConfiguration').addClass("active_butn");
            }
            else {
                $('#liConfiguration').addClass("main_link");
            }
}

我希望这可以添加新的类$indexPath（$path）；