维护从一个php页面到另一个页面的jquery事件

Question

我遇到了这样的情况：-有一个php页面-有一个折叠菜单的jQuery脚本-通过在php中传递变量，单击其中一个折叠的元素来加载另一个页面。

问题：- jQuery脚本也会重新加载，并取消我之前的选择。

下面是一个例子。我点击“菜单”，jQuery脚本作用于“折叠器”，但当我点击“鱼”链接(或其他)，我得到了页面显示，但菜单不会显示为折叠。

我想要实现的是：-在从一个页面移动到另一个页面时保持菜单折叠

这是一个php代码示例。

echo rightMenu();
function rightMenu(){

    $r  = '';

    $r .= '<ul id="collapser"><li>Menu<ul>';
    $r .= '<li><a href="main.php?show=page1">Fish</a></li>';
    $r .= '<li><a href="main.php?show=page2">Vegetables</a></li>';
    $r .= '<li><a href="main.php?show=page3">Meat</a></li></ul>';
    $r .= '</li></ul>';

    return $r;
};

谢谢你，Myriam

Answer 1

如果包含jQuery.cookie，则可以使用cookie来完成此操作，这应该会更简单：

$("#collapser").click(function () {
   //change to more appropriate value
   $.cookie('autocollapse', $(this).is(":visible"), {expires: 30});
});

//initial page load
if ($.cookie('autocollapse')) {
   $("#collapser").click();
}

Answer 2

当单击折叠时，您可以发送一个ajax请求，该请求记录指示折叠的某种会话变量：

//Your collapser click function
//record hidden status in data
$("#collapser").click(function () {
   if ($(this).data('hidden')) {
      $(this).slideDown().data('hidden', false);
   }
   else {
      $(this).slideUp().data('hidden', true);
   }
   //record hidden (collapsed) status on the server
   $.post('/record-collapser-hide.php', {'hidden': $(this).data('hidden')});
});

//On initial page load, collapse if #autocollapse is in the DOM
//Added by PHP code below
if ($("#autocollapse").length) {
   $("#collapser").data('hidden', false).click();
}


//--- record-collapser-hide.php ---
session_start();
$_SESSION['collapsercollapsed'] = isset($_POST['hidden']) ? $_POST['hidden'] : 0;


//--- function rightMenu() ---
...
$r .= '</li></ul>';
if (isset($_SESSION['collapsercollapsed']) && $_SESSION['collapsercollapsed']) {
   $r .= "<span style='display: none' id='autocollapse'>&nbsp;</span>";
}

注意:这段代码很可能不会按原样工作，但您应该能够遵循基本思想。