突出显示活动菜单选择

时间:2014-01-10 02:59:26

标签: jquery css vb.net twitter-bootstrap

使用此处提供的解决方案How to highlight active page in a masterpage menu?我能够在导航菜单上正确显示我的活动菜单项。我正在使用带有母版页的VB.NET。以下代码驻留在母版页中:

<script>
       function equalHeight(group) {
           tallest = 0;
           group.each(function () {
               thisHeight = $(this).height();
               if (thisHeight > tallest) {
                   tallest = thisHeight;
               }
           });
           group.each(function () { $(this).height(tallest); });
       }

       jQuery(document).ready(function () {
           App.init();
           // Call to set active menu selecttion
           var str = location.href.toLowerCase();
           $(".nav li a").each(function () {
               if (str.indexOf($(this).attr("href").toLowerCase()) > -1) {
                   $("li.active").removeClass("active");
                   $(this).parent().addClass("active");
               }
           });
           equalHeight($(".img-thumbnail"));

       });
</script>

ADDED:如果某个部分(例如“工具”)有多个属于它的页面,你能想到让上述代码选择正确的活动菜单项的任何方法吗?

1 个答案:

答案 0 :(得分:0)

使用此Javascript

 function LoadActiveMenu()
    {
        var str=location.href.toLowerCase();
        $("li a").each(function() {
            if (str.indexOf($(this).attr("href").toLowerCase()) > -1) {
                $("li.active").removeClass("active");
                $(this).parent().addClass("active");
            }
        });
        $("li.active").parents().each(function(){
            if ($(this).is("li")){
                $(this).addClass("active");
            }
        });
     }

并在下面的事件中调用此函数

<body onload="LoadActiveMenu();">
</body>