Question

即使在回发后，如何保持所选菜单保持活动状态？以下是我目前使用的编码。

HTML

$stmt = $db_con->prepare("INSERT INTO `blog`(`title`, `category`, `content`) VALUES (:title, :category, :content)");
$stmt->execute(array("title" => $_title, "category" => $_category, "content" => $_content));

CSS

<div id="menu-promo">
  <ul>
    <li><a href="#">menu1</a></li>
    <li><a href="#">menu2</a></li>
    <li><a href="#">menu3</a></li>
    <li><a href="#">menu4</a></li>
  </ul>
</div>

JS

#menu-promo {background-color: #ff9100; display: inline-block; font-family: Calibri; width: 100%; padding: 45px 20px 20px 20px; border: 1px 0px 0px 0px solid #b3e5fc; font-weight: bold; color: #fff!important;}
#menu-promo ul {margin: 0; padding: 0; text-align: center; display: block;}
#menu-promo ul > li {list-style: none; display: inline-block;}
#menu-promo ul > li a {color: #fff; border: 2px solid #ff9100; border-radius: 20px; padding: 10px 20px 10px 20px; text-decoration: none;}
#menu-promo ul > li a:hover {background-color: #eeeeee; border: 2px solid #01579b; cursor: pointer; color: #01579b; text-decoration: none;}
#menu-promo ul li a.active {background-color: #eeeeee; border: 2px solid #01579b; cursor: pointer; color: #01579b; text-decoration: none;}

Answer 1

一种选择是在代码中的每个page_load事件中注册一个启动脚本来调用JavaScript函数。

此功能要求您为每个菜单项设置id并传递该ID，例如。 #menuItemID

function setActive(menuItemID){
    var selector = '#menu-promo ul li ' + menuItemID;
    $(selector).addClass('active');
}

C＃＆amp; VB.Net （对于VB可能是[GetType]()）

ClientScript.RegisterStartupScript(GetType(), "Javascript", "javascript:setActive(thisMenuItemID); ", true);

如果你的菜单项目是＆＃39;文本正确匹配您的页面名称您可以使用像

这样的函数

function setActive(){
    // Might need to play with substring parameters
    var selector = '#menu-promo ul li a[name=' + location.pathname.substring(0, location.pathname.indexOf(".")) + ']';
    $(selector).addClass('active');
}

Answer 2

Add this in master page

     $(document).ready(function () {
          var page= document.location.pathname.match(/[^\/]+$/)[0];
          var limenu = $('.sidebar-menu li');
          $.each(limenu, function (index, value) {
              if ($(value).find('a').attr('href') != (page+'.aspx')) {
                    $(value).removeClass('active');                      
              } else {
                  if (!$(value).hasClass('active')) {
                       $(value).addClass('active');
                  }                   
              }
          });          
      });

回发后保持所选菜单处于活动状态

2 个答案: