Javascript vs c#在ASP中动态更改元素类/id.Net 4.5 mvc

Javascript vs C# for dynamically changing element class/id in ASP.NET 4.5 MVC

本文关键字：id Net mvc 元素 vs ASP 动态 Javascript      更新时间：2023-09-26

我是MVC新手，仍在学习，我想知道做我所描述的约定/最佳实践是什么。

我有一个菜单栏，它会根据你在哪个页面上的视觉变化。目前，我在每个.cshtml视图文件的顶部使用一个简单的JS .ready()脚本块来完成此操作，这工作得很好。当页面加载时，它遍历菜单栏<ul>并更改<li> id/classes:

@{ ViewBag.Title = "Test Page"; }
<script>
$(document).ready(function () {
    var listItems = $("#menu-bar li");
    listItems.each(function (li) {
        if ($(this).attr('id') == 'about-link') $(this).addClass('active');
        else $(this).removeClass('active');
    });
});
</script>
<!-- Rest of the .cshtml file... -->

我有一种明显的感觉，然而，这既不优雅也不理想。那么，什么是最好的方式来完成这个任务，特别是为MVC(或一般情况下，如果是这样的话)。

谢谢!

你可以使用Razor在你的布局中解决这个问题。cshtml文件。

<ul>
    <li class="@ViewBag.Home">Home</li>
    <li class="@ViewBag.About">About</li>
</ul>

然后在每个视图的顶部，将右边的设置为活动

@{
    ViewBag.Home = "active";
}
相关文章：