0

我正在尝试将 jquery .cookies 添加到我现有的折叠/展开菜单中，但是对于我的生活，我看不到我在哪里失败了。

谁能帮我解决这个问题？我已经看代码不到 9 个小时了，这是我今天应该写的最后一篇。我担心我的大脑已经达到了它的极限，但我无法忍受让工作未完成。这可能很容易，我只是看不到它。

我已将 cookie 设置为 visible_state 并且应该发生的事情是，每次用户单击展开/折叠/切换菜单区域时，它将 cookie 存储为一个类。

编辑：我忘了提... cexpand = 用于扩展的 cookie 类...

ccollapse - 折叠的 cookie 类

我原来的 .js（工作菜单）

$(document).ready(function() {
setTimeout(function() {
  // Grow/Shrink
  $('#menu3 > li > a.expanded + ul').show('blind');
  $('#menu3 > li > a.collapsed + ul').hide('blind');
  $('#menu3 > li > a').click(function() {
  $(this).toggleClass('expanded').toggleClass('collapsed').parent().find('> ul').toggle('blind');
});
$('.expand_all').click(function() {
$('#menu3 > li > a.collapsed').addClass('expanded').removeClass('collapsed').parent().find('> ul').show('blind');
});
$('.collapse_all').click(function() {
$('#menu3 > li > a.expanded').addClass('collapsed').removeClass('expanded').parent().find('> ul').hide('blind');
});
}, 0);
});

我的新 .js

$(document).ready(function() {
var visible_state = $.cookie("visible_state");
setTimeout(function() {
if ($('.expanded').attr('class')=='cexpand'){
  $(this).removeClass('cexpand');
  $(this).addClass('ccollapse');
  $.cookie('visible_state', 'ccollapse', { path: '/', expires: 100});
  $(this).hide('blind');
} else if ($('.collapsed').attr('class')=='ccollapse'){
  $(this).removeClass('ccollapse');
  $(this).addClass('cexpand');
  $.cookie('visible_state', 'cexpand', { path: '/', expires: 100 });
  $(this).show('blind');        
}   
  $('#menu3 > li > a.expanded + ul').show('blind');
  $('#menu3 > li > a.collapsed + ul').hide('blind');    
  $('#menu3 > li > a').click(function() {
  $(this).toggleClass('expanded', 'cexpand').toggleClass('collapsed', 'ccollapse').parent().find('> ul').toggle('blind');
});

$('.expand_all').click(function() {
  $('#menu3 > li > a.collapsed').addClass('expanded', 'cexpand').removeClass('collapsed', 'ccollapse').parent().find('> ul').show('blind');
});
$('.collapse_all').click(function() {
  $('#menu3 > li > a.expanded').addClass('collapsed', 'ccollapse').removeClass('expanded', 'cexpand').parent().find('> ul').hide('blind');
});
}, 0);
});

* *编辑* close.js ***

 $(document).ready(function() {

var visible_state = $.cookie('visible_state');

 if (visible_state == null){
$('#menu3 > li > a').addClass('collapsed');
$('#menu3 > li > a + ul.1').addClass('expanded');

 };

 if (visible_state == 'collapsed'){
$('#menu3 > li > a').removeClass('expanded');
$('#menu3 > li > a').addClass('collapsed');

$.cookie('visible_state', 'collapsed', { path: '/', expires: 100 });
 };
  if (visible_state == 'expanded'){
$('#menu3 > li > a').addClass('expanded');
$.cookie('visible_state', 'expanded', { path: '/', expires: 100 });
 };

 $('#menu3 > li > a').click(function() {
 if ($('#menu3 > li > a').attr('class')=='expanded'){
$(this).removeClass('expanded');
$(this).addClass('collapsed');
$.cookie('visible_state', 'collapsed', { path: '/', expires: 100 });

} else{
$(this).removeClass('collapsed');
$(this).addClass('expanded');
$.cookie('visible_state', 'expanded', { path: '/', expires: 100 });

}
});

$('#menu3 > li > a.expanded + ul.1').show('blind');
$('#menu3 > li > a.expanded + ul.2').show('blind');
$('#menu3 > li > a.expanded + ul.3').show('blind');
$('#menu3 > li > a.expanded + ul.4').show('blind');
$('#menu3 > li > a.expanded + ul.5').show('blind');
$('#menu3 > li > a.collapsed + ul.1').hide('blind');
$('#menu3 > li > a.collapsed + ul.2').hide('blind');
$('#menu3 > li > a.collapsed + ul.3').hide('blind');
$('#menu3 > li > a.collapsed + ul.4').hide('blind');
$('#menu3 > li > a.collapsed + ul.5').hide('blind');

$('.expand_all').click(function() {
  $('#menu3 > li >           a.collapsed').addClass('expanded').removeClass('collapsed').parent().find('>   ul').show('blind');
  $.removeCookie('visible_state');
  $.cookie('visible_state', 'expanded', { path: '/', expires: 100 });
});
$('.collapse_all').click(function() {
  $('#menu3 > li >   a.expanded').addClass('collapsed').removeClass('expanded').parent().find('> ul').hide('blind');
  $.removeCookie('visible_state');
  $.cookie('visible_state', 'collapsed', { path: '/', expires: 100 });
});
});

我的.html

<div id="leftnav" style="clear:left;">
<div id="wrapper">
  <ul id="menu3" class="leftnavmenu">
    <li class="leftnavitem1"><a href="#" class="expanded">Category 1 <span>1</span>   </a>
      <ul>
    <li class="subitem1"><a href="#">Link 1 <span>1</span></a></li>
    <li class="subitem2"><a href="#">Link 2 <span>1</span></a></li>
    <li class="subitem3"><a href="#">Link 3 <span>1</span></a></li>
      </ul
    </li>
    <li class="leftnavitem2"><a href="#" class="expanded">Category 2 <span>1</span></a>
      <ul>
    <li class="subitem1"><a href="#">Link 1 <span>1</span></a></li>
    <li class="subitem2"><a href="#">Link 2 <span>1</span></a></li>
    <li class="subitem3"><a href="#">Link 3 <span>1</span></a></li>
      </ul>
    </li>
        <li class="leftnavitem3"><a href="#" class="collapsed">Category 3 <span>1</span></a>
      <ul>
    <li class="subitem1"><a href="#">Link 1 <span>1</span></a></li>
    <li class="subitem2"><a href="#">Link 2 <span>1</span></a></li>
    <li class="subitem3"><a href="#">Link 3 <span>1</span></a></li>
      </ul>
    </li>
    <li class="leftnavitem4"><a href="#" class="collapsed">Category 4  <span>1</span></a>
      <ul>
        <li class="subitem1"><a href="#">Link 1 <span>1</span></a></li>
    <li class="subitem2"><a href="#">Link 2 <span>1</span></a></li>
    <li class="subitem3"><a href="#">Link 3 <span>1</span></a></li>
      </ul>
    </li>
    <li class="leftnavitem5"><a href="#" class="collapsed">Category 5 <span>1</span></a>
      <ul>
            <li class="subitem1"><a href="#">Link 1 <span>1</span></a></li>
    <li class="subitem2"><a href="#">Link 2 <span>1</span></a></li>
        <li class="subitem3"><a href="#">Link 3 <span>1</span></a></li>
          </ul>
    </li>
  </ul>
 </div>

我会在精神上买一杯咖啡吗？对于任何结束我的痛苦的人。

4

1 回答 1

0

$.cookie不存在。你用的是哪个插件？

否则我会建议使用Amplify JS Store。在 Html 5 时代，Cookie 并不是最好的存储方式。

于 2012-08-18T12:11:28.197 回答