Question

<nav class="mynav">
    <ul id="mynavigation">
        <li><a class="active" href="#hm">Main</a></li> /* Active Class */
        <li><a href="#pj">Projects</a></li>
        <li><a href="#port">Port</a></li>
        <li><a href="#contact">Contact</a></li>
    </ul>
</nav>

如何为....编写css或js。

如果单击项目（标记a），那么代码应该像这样工作

<nav class="mynav">
    <ul id="mynavigation">
        <li><a class="" href="#hm">Main</a></li>
        <li><a class="active" href="#pj">Projects</a></li>  /* Active Class */
        <li><a href="#port">Port</a></li>
        <li><a href="#contact">Contact</a></li>
    </ul>
</nav>

步骤
1.delete class ='active'in id ='mynavigation'
2.put class ='active'在标记a中有人点击id ='mynavigation'

Answer 1

使用jQuery的removeClass和addClass方法

$('#mynavigation li a').click(function(){
  $('#mynavigation li a').removeClass('active');
  $(this).addClass('active')
});

Answer 2

给出列表项ID，然后只做

document.getElementById("myId").class = "";

并激活它

document.getElementById("myId").class = "active";

Answer 3

如果您的页面没有重新加载或重定向到另一个

，此代码将起作用

 $('body').on('click' , '#mynavigation li a', function(){
    $('#mynavigation li a').removeClass('active');
      $(this).addClass('active')
  });

如果你的代码要去其他地方的页面，那么这个脚本将不起作用。要执行必需的操作，您必须将单击链接存储到缓存中，然后将活动类放在存储在缓存中的链接

     var prevLink = '';

    if (checkCookie('clickedLink') != '') {
        prevLink = getCookie('clickedLink');
        $('.navi li a').each(function() {
            if ($(this).attr('href') == prevLink) {
                console.log($(this).attr('href'));
                $(this).parent().addClass('active');
            } else {
                $(this).parent().removeClass('active');
            }
        })
    };

    function setCookie(cname, cvalue, exdays) {
        var d = new Date();
        d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
        var expires = "expires=" + d.toUTCString();
        document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
    };

    function getCookie(cname) {
        var name = cname + "=";
        var ca = document.cookie.split(';');
        for (var i = 0; i < ca.length; i++) {
            var c = ca[i];
            while (c.charAt(0) == ' ') {
                c = c.substring(1);
            }
            if (c.indexOf(name) == 0) {
                return c.substring(name.length, c.length);
            }
        }
        return "";
    };

    function checkCookie(cookieName) {
        var user = getCookie(cookieName);
        if (user != "") {
            return true;
        } else {
            return false;
        }
    };

Answer 4

$（ '＃mynavigation'）。找到（ 'A'）。每个（函数（）{ $（this）.on（'click'，function（）{If（！（$（this）.hasClass（'active'）））{ $（本）.parent（）的兄弟姐妹（）儿童（ 'A'）removeClass（ '激活'）。; $（本）.addClass（ '激活'）; }}; }）;

如何在单击另一个

4 个答案: