Question

如何在离开页面时保留Jquery功能？当链接为空/＃时，下面的代码运行良好，但是当我更改＃并使其成为路径链接时，jquery似乎无法正常运行。我点击它，它改变了背景但是当它转到链接时背景消失了，代码中是否有我想念的东西？

＆＃13;

$(document).ready(function(e){
  $('#main-menu li a').click(function(e) {
    $('#main-menu li a').removeClass('active');
    $(this).addClass('active');
  });
});

＆＃13;

#main-menu li {
  display: inline-block;
  font-family: 'Raleway', sans-serif;
  padding: 17px 25px;
}
#main-menu li a {
  color:#333333;
  font-size:15px;
}
#main-menu li.active a {
  color:#0198cf;
}
#main-menu li:last-child  {
  padding-right: 0;
}

.active{
  background-color:#ccc;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="topnav" id="main-menu">
  <li ><a href="#" class="active" ><i class="fa fa-home" aria-hidden="true"></i> Home</a></li>
  <li><a href="#" ><i class="fa fa-file" aria-hidden="true"></i> Home2</a></li>
  <li><a href="#" ><i class="fa fa-codepen" aria-hidden="true"></i> Home3</a></li>
  <li><a href="#" ><i class="fa fa-globe" aria-hidden="true"></i> Home4</a></li>
</ul>

＆＃13;

Answer 1

您需要停止元素的默认行为。您应该为点击事件调用annotate函数：

g + geom_point(data = selected.df, aes(x = x, y = y, colour = factor(col)), size = 2) + 
  annotate("text",size=2,x=selected.df$x,y=selected.df$y,label=selected.df$id)+
  theme(legend.position="none")

Answer 2

添加此脚本：

$(function () {
    var url = window.location.pathname,
    urlRegExp = new RegExp(url.replace(/\/$/, '') + "$");
    $('#main-menu li a').each(function () {
        if (urlRegExp.test(this.href.replace(/\/$/, ''))) {
            $(this).addClass('active');
            $(this).parent().previoussibling().find('a').removeClass('active');
        }
    });
});

Answer 3

如果用户离开当前页面，jQuery修改的样式将永久消失，因为它们不会保存在任何地方。

但是，使用javascript可以存储cookie，如果存在cookie，您可以添加所需的背景样式。

有关存储Cookie的更多信息，请参阅https://www.w3schools.com/js/js_cookies.asp。

重新加载页面时如何保持Jquery功能

3 个答案: