Как использовать Cookies для поддержания состояния страницы?

Question

У меня есть веб-сайт с этим меню

<li><a href="#">Man</a> 
    <ul class="sub_menu"> 
     <li><a href="mcaps">Caps</a></li> 
     <li><a href="#">Shirts</a></li> 
     <li><a href="#">Tshirts</a></li> 
     <li><a href="#">Jackets</a></li> 
     <li><a href="#">Jeans</a></li> 
     <li><a href="#">Shorts</a></li> 
     <li><a href="#">Footwear</a></li> 
    </ul> 
</li> 

<li><a href="#">Woman</a> 
    <ul class="sub_menu"> 
     <li><a href="#">Caps</a></li> 
     <li><a href="#">Sunglasses</a></li> 
     <li><a href="#">Shirts</a></li> 
     <li><a href="#">Tshirts</a></li> 
     <li><a href="#">Dresses</a></li> 
     <li><a href="#">Jackets</a></li> 
     <li><a href="#">Jeans</a></li> 
     <li><a href="#">Purse</a></li> 
     <li><a href="#">Handbags</a></li> 
     <li><a href="#">Footwear</a></li> 
    </ul> 
</li> 

Теперь мой код JQuery Я получаю изображения и сказать, если пользователь нажмет man>mcaps

$(document).ready(function() { 
    $('ul.sub_menu a').click(function(e) { 
     e.preventDefault(); 
     var txt = $(this).attr('href'); 
     $.ajax({ 
      type: "POST", 
      url: "thegamer.php", 
      data:{ send_txt: txt }, 
      success: function(data){ 
       $('#container').fadeOut('8000', function(){ 
        $('#container').html(data); 
        $('#container').fadeIn('8000'); 
       }); 
      } 
     }); 
    }); 
}); 

Теперь, когда я обновить страницу, он изо всех сил и отображается индексная страница, я знаю, что мне нужно работать с файлами cookie, но как их использовать для поддержки этой страницы?

Когда пользователь нажимает Woman>jeans, теперь cookie должен быть установлен и не исчезать на странице обновления.

Любой подробный код был бы полезен.

Answer 1

Прежде всего, вам необходимо скачать this plugin и добавить его на свою страницу.

Затем измените код так:

$(document).ready(function() { 
    // set the content on page load to match the last clicked link 
    setContainerHtml($.cookie("activeElementHref")); 

    // set the content on link click 
    $('ul.sub_menu a').click(function(e) { 
     e.preventDefault(); 
     var txt = $(this).attr('href'); 
     $.cookie("activeElementHref", txt) 
     setContainerHtml(txt); 
    }); 
}); 

function setContainerHtml(href) { 
    $.ajax({ 
     type: "POST", 
     url: "thegamer.php", 
     data:{ send_txt: href }, 
     success: function(data){ 
      $('#container').fadeOut('8000', function(){ 
       $('#container').html(data); 
       $('#container').fadeIn('8000'); 
      }); 
     } 
    }); 
} 

Answer 2

1. Вам необходимо включить одну из доступных плагинов JQuery печенья
2. Там будет метод (в основном называется $ .cookie), которые вы можете использовать, чтобы установить, читать и удалять куки в зависимости от заданного ключа (ваш выбор)

что-то вроде этого

$.cookie("mykey", "10"); //set value of cookie to 10 
var mycookie = $.cookie("mykey"); // get cookie value or NULL if not set 
$.cookie("mykey", null); // unset = delete cookie 

Есть несколько параметров (например, срок действия и т.д.), которые вы можете изучить по требованию