C# 停止刷新导航栏-Umbraco

我找不到任何关于我的问题，所以我决定自己发布一个

我使用的导航栏有下拉菜单。每当我打开下拉菜单并导航到其中一个页面时，导航就会刷新并关闭下拉菜单。当我转到其中一个页面时，下拉菜单需要保持打开状态，我尝试了

Model.Content.antestorself（）.subjections（“文档”）

来避免刷新导航栏，但这似乎不起作用（如人们所说）

以下是我的菜单结构：

“绿巨人浏览器”下面的所有内容都在下拉列表中，当我再次单击“绿巨人浏览器”时，它们将消失

这是我的密码：

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage
<div class="col-sm-3">
    <div class="NavDigiCampuz">
        <h3>Helpcentrum</h3>
        <li class="NoBullet"><a class="NormalA" href="https://digicampuz.nl/">Terug naar digicampuz</a></li><br>
            <ul class="nav nav-list tree">
                @{                                  
                    var documentRootNodeId = Model.Content.GetPropertyValue("documentRoot", true); // Fetch recursive document root id.
                    var selection = Umbraco.TypedContent(documentRootNodeId).Children.Where("Visible"); // Select all nodes below the document root.
                }

                @foreach(var item in Model.Content.AncestorOrSelf(2).Descendants("document").ToList()){
                    foreach (var ItemChild in @item.Children("categorieMenu")){
                        if(ItemChild.Children.Any())
                        {
                        <li class="MenuItems"><p>@ItemChild.Name</p></li>   
                            foreach (var Subitem in @ItemChild.Children){
                                if (Subitem.Children("hoofdstuk").Any())
                                {
                                    <li class="item">
                                        @if(Subitem.GetPropertyValue("hoofdstukIcoon") != "") {
                                            <a class="NormalA aNav" href="#"><i class="fa fa-@(Subitem.GetPropertyValue("hoofdstukIcoon")) fa-fw"></i> @Subitem.Name <i id="Arrow" class="fa fa-arrow-right" style="font-size:10px;" aria-hidden="true"></i></a>
                                        }else{
                                            <a class="NormalA aNav" href="#">@Subitem.Name <i id ="Arrow" class="fa fa-arrow-right" style="font-size:10px;" aria-hidden="true"></i></a>
                                        }
                                        @foreach (var Finalitem in @Subitem.Children){
                                        <ul class="submenu">
                                            @if(Finalitem.GetPropertyValue("hoofdstukIcoon") != "") {
                                            <br><li><a class="NormalA aNav" href="@Finalitem.Url"><i class="fa fa-@(Finalitem.GetPropertyValue("hoofdstukIcoon")) fa-fw"></i>@Finalitem.Name </a></li>  
                                            }else{
                                                <br><li><a class="NormalA aNav" href="@Finalitem.Url">@Finalitem.Name</a></li><br>
                                            }
                                        </ul>   
                                        } 
                                    </li>
                                    }else
                                        {
                                            if(Subitem.GetPropertyValue("hoofdstukIcoon") != "") {
                                                <li><a class="NormalA aNav" href="@Subitem.Url"><i class="fa fa-@(Subitem.GetPropertyValue("hoofdstukIcoon")) fa-fw"></i> @Subitem.Name</a></li>
                                            }else{
                                                <li><a class="NormalA aNav" href="@Subitem.Url">@Subitem.Name</a></li>  
                                            }
                                    }
                                }   
                            }
                        }
                    }   
            </ul>
    </div>
</div>

<script>
    $(".item").click(function(){
        $(this).children(".submenu").toggle(); //it will display or hide your submenu when clicking the item.
    });
</script>

<style>
    .submenu{
    display: none;
    list-style:none;
    }
</style>    

@继承Umbraco.Web.Mvc.UmbracoTemplatePage
帮助中心



@{                                  
var documentRootNodeId=Model.Content.GetPropertyValue（“documentRoot”，true）；//获取递归文档根id。
var selection=Umbraco.TypedContent（documentRootNodeId）.Children.Where（“可见”）；//选择文档根目录下的所有节点。
}
@foreach（Model.Content.antestorself（2.document）（“document”）.ToList（）中的var项）{
foreach（var ItemChild在@item.Children（“categorieMenu”）中）{
if（ItemChild.Children.Any（））
{
@ItemChild.Name

foreach（@ItemChild.Children中的var子项）{
if（子项.Children（“hoofdstuk”）.Any（））
{

@if（子项.GetPropertyValue（“hoofdstukIcoon”）！=“”）{
}否则{
}
@foreach（var Finalitem in@Subitem.Children）{

@if（Finalitem.GetPropertyValue（“hoofdstukIcoon”）！=“”）{


}否则{



}

} 

}否则
{
if（子项.GetPropertyValue（“hoofdstukIcoon”）！=“”）{

}否则{

}
}
}   
}
}
}   

$（“.item”）。单击（函数（）{
$（this）.children（“.submenu”）.toggle（）；//单击项目时，它将显示或隐藏您的子菜单。
});
.子菜单{
显示：无；
列表样式：无；
}

---

我确实计划在一切正常时从页面中删除脚本和样式

首先，代码中有几个问题：

• 删除要筛选子项的位置，并将其保持为像

  var selection=Umbraco.TypedContent（documentRootNodeId）.Children（“可见”）

• 将hoofdstukIcoon强制转换为字符串

  子项。GetPropertyValue（“hoofdstukIcoon”）

• 第一个
  应该在导航列表中，而不是外部
• 如果希望使用css，则不应将
  放在列表项之间

现在，我们将关注您的子菜单问题。使用javascript所做的只是使用display属性来隐藏或显示子菜单，但是当呈现页面时，Razor不知道是否应该隐藏子菜单。要解决这个问题，您必须创建一个新类，如Razor和Javascript可以使用的

.visible

您还应该将您的

移出您的

@foreach（Subitem.Children中的var Finalitem）

，因为您现在要做的是创建一个新列表，其中每个列表都有一个项目

如果子菜单中没有子菜单，并且我们不希望子菜单

@if（Subitem.children.Any（））{

使用Razor告诉您的子菜单是否必须显示的方法是：

var isVisible = Model.Content.IsDescendantOrSelf(Subitem) ? "visible" : "";
<ul class="submenu @isVisible">

你的CSS是这样的：

<style>
    .submenu {
        display: none;
        list-style: none;
    }

    .submenu.visible {
        display: block;
    }
</style>   

.子菜单{
显示：无；
列表样式：无；
}
.子菜单.可见{
显示：块；
}

嘿，伙计，我不知道我的代码有这样的问题，除了令人耳目一新的部分：P我不是专家（只是初学者）使用razor，这对我的知识真的很有帮助！感谢您在这里花时间帮助我！让我开心一天。我建议您使用Visual Studio。社区版是免费的。它在提示和智能感知方面帮助您。我有Visual Studio，付费版。我只是无法访问umbraco的解决方案。

<style>
    .submenu {
        display: none;
        list-style: none;
    }

    .submenu.visible {
        display: block;
    }
</style>