Question

我有一个主菜单视图：

    <div class="submenu">
    <ul>
        @foreach (var p in Model)
        {
            <li>
                <div class="manu_bg">
                    @Html.ActionLink(p.Name, "ListProductByGroupID", "Product", new { GroupID = p.GroupCategoryID, GroupName = p.Name }, null)
                </div>
                @{Html.RenderAction("ListCateByGroupID", "Category", new { GroupID = p.GroupCategoryID });
                }
            </li>
        }
    </ul>
</div>

和主视图中的子菜单视图：

 @foreach (var i in Model)
    {
        <li>
                @Html.ActionLink(i.Name, "ListProductByCateID", "Product", new { CateID = i.CategoryID, CateName = i.Name }, new { id="link"})  
        </li>    
    }

和一些Javascript来为活动链接添加css类：

 window.onload = ActiveLink;
function ActiveLink() {
    var link = document.getElementById("link");
        link.onclick = showActive;
}

function showActive() {
    var selectedlink = this.text;
    var link = document.getElementById("link");
        if (link.text == selectedlink) {
            link.className = " active";
        }
        else { link.className = ""; }


}

我的javascript无效？

Answer 1

为该链接添加ID，以便您可以找到它：

@Html.ActionLink(i.Name, "ListProductByCateID", "Product", new { CateID = i.CategoryID, CateName = i.Name }, new { id = "ListByCatLink" })</div>

然后按ID选择它并添加类......

使用纯Javascript：

var link = document.getElementById("ListByCatLink");
link.className = link.className + " active";

或jQuery，如果你正在使用它：

$("#ListByCatLink").addClass("active");

如何通过JavaScript在Html.ActionLink中添加Css类？

1 个答案: