包含活动菜单中的javascript菜单

Question

I want to include this menu to my web page with following index page code:

<div id="header"><?php include "shared/header.php"; ?></div>        
<div id="container">
    <div id="menu"><?php include "shared/menu.php"; ?></div>
    <div id="content"></div>
</div>
<div id="footer"><?php include "shared/footer.php"; ?></div>

And my submenu items have links like: index.php?page=page_something&id=1 .

As you can see in the jsfiddle code, active menu style is different than the inactive ones. So there is no problem. But when I using this code in my web page, this does not work.

When I click a menu and load a new page, active menu style is gone and it turns to initial style. So users can't figure out which page they are visiting right now. I hope I could explain my problem.

Answer 1

Forgive me as I'm not familiar with PHP, but if you are loading a completely new page each time, then the accordion is going to reset to whatever the JS is that you have on that page.

Unless you are altering only part of the page, hard-coding default accordion settings on each page, or somehow storing session variables on the browser and consuming them via JS, then there's no way for the accordion to keep its state as you navigate across pages.

EDIT: I see you are passing some parameters in your query string. But I don't see in your JS where you are parsing them in your page/accordion initialization.

Answer 2

try someting like this :

<div id="header"><?php include "shared/header.php"; ?></div>        
<div id="container">
    <div id="menu"><?php include "shared/menu.php"; ?></div>
    <div id="content">
    <?php
    if(isset($_GET['page'])){
        include 'shared/'.$_GET['page'].'.php';
    }
    ?>
    </div>
</div>
<div id="footer"><?php include "shared/footer.php"; ?></div>

I hope this help.