Question

我是JQuery的新手，我正在开发一个基于Superfish脚本的菜单。当我浏览链接时，我遇到了将addClass保持在当前点击项目集上的麻烦。

我的代码：

JS

<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function(){

jQuery("ul.sf-menu").superfish({pathClass:  'corrente'});            

jQuery('#sf-menu li a').click(function() {
      jQuery("#sf-menu li").removeClass('corrente');
      jQuery(this).parents().filter("li").addClass('corrente');
      jQuery("ul.sf-menu").superfish({pathClass:  'corrente'    });
});
});
</script>

HTML

<ul id="sf-menu" class="sf-menu sf-navbar">
  <li><a href="#">Home</a></li>
  <li><a href="#">Band</a></li>
  <li><a href="#">Solo Projects</a>
      <ul>
      <li><a href="#">Tim</a></li>
      <li><a href="#">Tom</a></li>
      <li><a href="#">John</a></li>
      </ul>
  </li>
  <li><a href="#">Media Appearances</a></li>
  <li><a href="#">Tour</a>
      <ul>
     <li><a href="#">The Reunion Tour</a>
         <ul>
        <li><a href="#">North American Leg</a></li>
     </ul>
         </li>
      </ul>
  </li>
  <li><a href="#">Gallery</a></li>
</ul>

上面的html工作正常，类“corrente”被正确设置，但是当我更改html插入实际链接时，该类设置正常但在加载目标页面时迷路。

您能否就如何添加课程并通过目的地页面传递给我任何建议？

提前谢谢

Answer 1

当您转到新页面时，整个Javascript环境会重置，因此您无法在页面之间保持javascript更改。

处理此问题的可能方法：

在iframe中打开新页面在一个单独的窗口中。外面的页面（对于iframe）或原始页面页面（对于单独的窗口）没有重新加载，所以javascript发生了变化不会丢失。
当您使用时，在网址中添加某种查询字符串传递到新页面，然后解释中的查询字符串要制作的新页面（在javascript中）无论你再做什么改变。
将数据放入Cookie中，以便您在新页面上应用更改。

Answer 2

如果它仍有帮助，我使用名为jquery.cookie的jQuery插件。

在我的情况下，我正在使用WordPress和一个测验插件，在每一步重新加载页面之后我就失去了修改。

因此，在我设置jquery.cookie插件后，我能够保留jQuery修改，例如添加类或删除它们。

Answer 3

你可以

存储添加到cookie中的类
向服务器发出一个AJAX请求，以便在服务器上保留状态（可能在数据源中，例如数据库）

JQuery在页面重新加载后保存addClass

3 个答案: