【问题标题】:chaning the class of menu item in the master page更改母版页中菜单项的类别
【发布时间】:2014-01-01 19:20:33
【问题描述】:

我在母版页中有一个菜单项 .. 我使用 javascript 在单击时更改了类。它会改变类一秒钟,但是当它重定向到其他页面时,它变得相同了。知道我是如何做到的应该这样做

我现在无法访问完整的代码仪式,但它是这样的(我使用了一些警报框只是为了看看发生了什么......)

<style>
test1{ color: red;
   height:1000px;
      font-size:5px ;
       background-color:Aqua;
      } 

      test2 
      { font-family:Kozuka Mincho Pro M;
          color: red;
      font-size: 5px } 

<script type="text/javascript">
var lastid = "";
function myFunc(id) {
    alert(id);
    if (lastid != "") {
        document.getElementById(lastid).removeAttribute("class", "test2");
        document.getElementById(lastid).setAttribute("class", "test1");
        var a = document.getElementById(lastid);

        alert(a.getAttribute("class"));

    }
    var element = document.getElementById(id);
    document.getElementById(id).setAttribute("class", "test2");
    var cssid = id;
    $("#" + id).addClass('test1');


    alert(document.getElementById(id).getAttribute("class"));
    lastid = id;

}
    </script>


<li  id="firstry" onclick="myFunc(this.id);" ><a href="master-child.aspx"> Click</a> </li>

【问题讨论】:

  • 如果您希望类值在页面间保持不变,您需要将类的值(因为它与用户相关)存储在某处,例如 cookie、会话或数据库.由于您是在 javascript 中执行此操作,因此 cookie 可能是最简单的。

标签: javascript jquery asp.net css menu


【解决方案1】:

我已经使用 Jquery 完成了此操作.. 它让事情变得更容易.. 这会遍历菜单中的每个链接,然后添加与当前页面匹配的类.. 以下是脚本:

 <script type="text/javascript">
        $(document).ready(function () {
            $('#subnav a').each(function (index) {
                if (this.href.trim() == window.location)
                    $(this).addClass("selected");
            });
        });
  </script>

【讨论】:

    【解决方案2】:

    一种方法是在正文标签中添加一个与页面名称相对应的类和一个 CSS 类。

    <body id="home">
    

    然后是活动菜单项的 css,假设您的菜单项上有类名:

    #home li.firstitem { ... }
    #about li.seconditem { ... }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2016-09-27
      • 1970-01-01
      • 1970-01-01
      • 2011-06-11
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多