bootstrap的3級菜單樣式,支持母版頁保留打開狀態(tài)實現(xiàn)方法
razor視圖的,母版頁
依舊不多說,直接上代碼
<ul class="sidebar-menu"> @for (int i = 0; i < mList.Count; i++) { if (mList[i].FatherID == 0) { mCList = GetChild(mList[i].ModuleId, mList);<!--二級菜單的集合--> <li class="treeview"><a href="#"><i class="fa fa-folder-o"></i><span>@mList[i].ModuleName</span><i class="fa fa-angle-left pull-right"></i></a><!--一級菜單--> <ul class="treeview-menu"> @for (int j = 0; j < mCList.Count; j++) //二級的循環(huán) { if (mCList[j].FatherID == 41) //如果是CRM 則進(jìn)這個循環(huán) { mSList = GetChild(mCList[j].ModuleId, mList); <!--三級菜單的集合--> <li><a href="javascript:void(0);" data-id="@mCList[j].ModuleId"><i class="fa fa-share"></i>@mCList[j].ModuleName<i class="fa fa-angle-left pull-right"></i></a><!--二級菜單--> <ul class="treeview-menu"> @for (int k = 0; k < mSList.Count; k++) //三級菜單的循環(huán) { if (!String.IsNullOrEmpty(mSList[k].RoteURL)) { <li><a href="@Url.Content(mSList[k].RoteURL)?cid=@mSList[k].ModuleId" data-id="@mSList[k].ModuleId"><i class="fa fa-circle-o"></i>@mSList[k].ModuleName</a></li> <!--三級菜單--> i++; } else { <li><a href="javascript:void(0)" data-id="@mSList[k].ModuleId"><i class="fa fa-circle-o"></i>@mSList[k].ModuleName</a></li> <!--三級菜單--> i++; } } </ul> </li> i++; } else //不是CRM 則進(jìn)這個 { if (!String.IsNullOrEmpty(mCList[j].RoteURL)) { <li><a href="@Url.Content(mCList[j].RoteURL)?cid=@mCList[j].ModuleId" data-id="@mCList[j].ModuleId"><i class="fa fa-circle-o"></i>@mCList[j].ModuleName</a></li> <!--二級菜單--> i++; } else { <li><a href="javascript:void(0);" data-id="@mCList[j].ModuleId"><i class="fa fa-circle-o"></i>@mCList[j].ModuleName</a></li> <!--二級菜單--> i++; } } } </ul> </li> } } </ul>
重點來了
$.widget.bridge('uibutton', $.ui.button); var _url = $.getUrlParam("cid"); $(".sidebar-menu li a").each(function () { //保留菜單打開的狀態(tài) var _id = $(this).data("id"); if (_id == _url) { $(this).parent().parent().show(); } }); $(".sidebar-menu li a").click(function () { $(this).addClass(""); }) });
獲取菜單參數(shù)的方法
(function ($) { $.getUrlParam = function (name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //構(gòu)造一個含有目標(biāo)參數(shù)的正則表達(dá)式的對象 var r = window.location.search.substr(1).match(reg); //匹配目標(biāo)參數(shù) if (r != null) { return unescape(r[2]); //返回參數(shù)值 } else { return null; } } })(jQuery);
效果圖
以上就是小編為大家?guī)淼腷ootstrap的3級菜單樣式,支持母版頁保留打開狀態(tài)實現(xiàn)方法全部內(nèi)容了,希望大家多多支持腳本之家~
相關(guān)文章
javascript實現(xiàn)復(fù)制與粘貼操作實例
這篇文章主要介紹了javascript實現(xiàn)復(fù)制與粘貼操作,以實例形式講述了javascript實現(xiàn)復(fù)制與粘貼操作的實現(xiàn)方法,需要的朋友可以參考下2014-10-10js前端身份證號、手機號脫敏、手機號、身份證號加密處理(ios瀏覽器兼容性問題)
這篇文章主要給大家介紹了關(guān)于js前端身份證號、手機號脫敏、手機號、身份證號加密處理的相關(guān)資料,還介紹了ios瀏覽器兼容性問題,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-11-11使用JavaScript italics方法實現(xiàn)文本變斜體教程示例
這篇文章主要為大家介紹了JavaScript italics實現(xiàn)文本變斜體教程示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-12-12JS實現(xiàn)求出一個字符串中最多出現(xiàn)的字符和個數(shù)
這篇文章主要為大家介紹了字符串中最多的重復(fù)字符的計算代碼,需要的朋友可以參考下2007-07-07javascript中利用柯里化函數(shù)實現(xiàn)bind方法【推薦】
下面小編就為大家?guī)硪黄猨avascript中利用柯里化函數(shù)實現(xiàn)bind方法【推薦】。小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考,一起跟隨小編過來看看吧2016-04-04