AdminLTE 3 选中下拉菜单子项时如何激活父菜单与当前子项样式

提供两种适配不同技术场景的实现方式：

方案1：前端JS实现（通用无后端依赖） #

页面加载时检测当前路径，匹配到View Enquiry页面自动添加对应样式类：

// 等待DOM加载完成后执行
document.addEventListener('DOMContentLoaded', function() {
  // 判断当前页面是否为View Enquiry页
  if (window.location.pathname.includes('/Enquiry/ViewEnquiry.aspx')) {
    // 父级菜单添加展开类
    const parentMenu = document.getElementById('liStaff_Enquiry');
    parentMenu.classList.add('menu-is-opening', 'menu-open');
    // 子菜单添加高亮类
    const activeItem = document.getElementById('aStaff_aViewEnquiry');
    activeItem.classList.add('active');
  }
})

• 注意：如果代码执行时机晚于AdminLTE treeview插件初始化，可将代码放在页面底部</body>标签前执行即可。

方案2：ASP.NET服务端实现（适配现有runat="server"标记） #

直接在ViewEnquiry.aspx的后台Page_Load事件中修改控件样式：

protected void Page_Load(object sender, EventArgs e)
{
    // 给父级li添加展开类
    liStaff_Enquiry.Attributes["class"] = "nav-item menu-is-opening menu-open";
    // 给当前选中的a标签添加高亮类
    aStaff_aViewEnquiry.Attributes["class"] = "nav-link active";
}

如果你把菜单写在了母版页（MasterPage）中，需要先通过FindControl获取母版页内的控件再修改属性，参考代码：

// 查找母版页中的父li控件
HtmlGenericControl parentMenu = (HtmlGenericControl)Master.FindControl("liStaff_Enquiry");
parentMenu.Attributes["class"] = "nav-item menu-is-opening menu-open";
// 查找母版页中的子a控件
HtmlAnchor activeItem = (HtmlAnchor)Master.FindControl("aStaff_aViewEnquiry");
activeItem.Attributes["class"] = "nav-link active";

内容的提问来源于stack exchange，提问作者Mani Rathinam