Here is a menu in which 2 lists (length and width) are hidden in the initial position, but they open when you click on them and when you click on the link of the selected item - they close to the default position (works out $ ("ul"). Hide ( );). How to make, that at transition the openness or closeness of the menu was transferred in js code?

Here is a link to jsfiddle (for general presentation): http://jsfiddle.net/Alexboo/nh3jutfb/3/

Css file:

.box { width: 250px; border: 1px solid #d1d1d1; } h3 { font-size: 13px; cursor: pointer; } h3 span { float: right; cursor: pointer; } .line { height: 2px; background-color: lightgrey; }

Html file:

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="box"> <h3>Длина:<span class="expand">+</span></h3> <ul> <li><a href="..."></a>1 метр</li> <li><a href="..."></a>2 метра</li> <li><a href="..."></a>3 метра</li> </ul> <div class="line"></div> <h3>Ширина:<span class="expand">+</span></h3> <ul> <li><a href="..."></a>1 метр</li> <li><a href="..."></a>2 метра</li> <li><a href="..."></a>3 метра</li> </ul> </div> <script> $(document).ready(function(){ $("ul").hide(); // Эта строка прячет список $(".box h3").click(function(){ $(this).next().slideToggle(); var text = $("span",this).text(); $("span",this).text(text != "+" ? "+" : "-") }); }); </script>

    2 answers 2

    I would make a GET parameter, let's say during the transition you generate 'www.example.com?menu=1', and in the code you type in the js parsit GET request

     function $_GET(key) { var s = window.location.search; s = s.match(new RegExp(key + '=([^&=]+)')); return s ? s[1] : false; }

    and then ifeam choose the menu state. Advanced example:

     ?menu=11 = Выбраны пункты 1,1 ?menu=12 = Выбраны пункты 1,2 ?menu=13 = Выбраны пункты 1,3

    And so on...

    • Anton, thanks, now I understand your code ... I do not need to pass the selected item (I implement it in a different way), I need to transfer to replace the line $ ("ul"). Hide (); , which on the new page would not close the menu, as by default! For example, the length is open, the width is closed — this is how it was transmitted, and not closed, as defined by default with the string $ ("ul"). Hide (); - Alexander
     $(document).ready(function(){ var menu = $_GET(page); if(menu == '') $("ul").hide(); // если первый раз - menu пустое - скрываем // $("ul").hide(); тут убираем $(".box h3").click(function(){ $(this).next().slideToggle(); var text = $("span",this).text(); $("span",this).text(text != "+" ? "+" : "-") }); }); function $_GET(key) { var s = window.location.search; s = s.match(new RegExp(key + '=([^&=]+)')); return s ? s[1] : false; }
    • when writing the $ _GET (key) function, $ (this) .next (). slideToggle () stops working, i.e. the menu does not close - Alexander