如何从_Layout.cshtml页面隐藏页面上的特定元素

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (26)

我在mvc 5项目上工作。

在我的每个页面中显示_Layout.cshtml名为id="topBar"this元素的html元素。

但我有一个名为About.cshtml的页面我不希望这个页面只显示id="topBar"所有其他html元素的元素_Layout.cshtml我想让它们正常显示About.cshtml

任何想法如何实现上述描述的外观?

提问于
用户回答回答于

实现此目的的一种简单方法(不使用javascript),是ViewBag在你的内部设置一个值,Action并在布局中使用它,如下所示:

_Layout.cshtml

@if (ViewBag.ShowTopBar ?? false)
{
    <div id="topBar">

    </div>
}

控制器内部的操作:

public class MyAwesomeController : Controller
{

    public ActionResult About()
    {
        ViewBag.ShowTopBar = true;
        return View();
    }

}
用户回答回答于

有两种选择:

1.为每个body元素添加ID

您可以ID在每个页面的主体中添加一个包含例如Controller和Action名称的主体,然后添加CSS规则以隐藏about页面上的topBar元素。

首先,让我们为控制器和动作名称创建两个字符串变量。在_Layout.cshtml中执行此操作:

@{
    string controller = ViewContext.RouteData.Values["controller"].ToString();
    string action = ViewContext.RouteData.Values["action"].ToString();
}

接下来,将ID添加到正文:

<body id="@controller-@action">

在你的css中,你现在可以添加一个规则来隐藏about页面中的topbar(假设控制器被称为HomeController):

#Home-About #topBar {display:none;}

您还可以使用扩展方法来获取控制器和操作名称。例如像这样的东西。

2.在“关于”页面上使用jQuery

你可以在你的about页面上添加一个Javascript并使用jQuery隐藏topbar(我假设jQuery已经加载):

<script>
   $("#topBar").hide();
</script>

扫码关注云+社区

领取腾讯云代金券