Добавление куки-файлов к простой функции

Question

Мне нужно добавить куки-файлы, чтобы при открытии (показе) одного div и пользователь нажимал на него, обновляя последнее состояние.

Я знаю, что это должно быть легко, но im полный noob в js-скрипте и был более чем на моей голове. Любая помощь будет более чем оценена. Я рассматривал разные примеры на этом форуме, но они собраны и непонятны. Ищете простое решение для простого кода. Спасибо!

<script type="text/JavaScript"> 
$(document).ready(function(){  
    $('a.row_view').click(function() { 
     $('.contentPadd.r_view').css('display', 'block'); 
     $('.contentPadd.l_view').css('display', 'none') 
     $('.contentPadd.t_view').css('display', 'none'); 
    }); 
    $('a.list_view').click(function() { 
     $('.contentPadd.r_view').css('display', 'none') //horizontal 
     $('.contentPadd.l_view').css('display', 'block') //list 
     $('.contentPadd.t_view').css('display', 'none') //thumbnails 
    }); 
    $('a.table_view').click(function() { 
     $('.contentPadd.r_view').css('display', 'none') 
     $('.contentPadd.l_view').css('display', 'none') 
     $('.contentPadd.t_view').css('display', 'block') 
    }); 
});          
</script> 

<a class="row_view">1</a>&nbsp;&nbsp;<a class="list_view">2</a>&nbsp;&nbsp;<a class="table_view">3</a> 

<div class="contentPadd r_view">NUMBER 1</div> 
<div class="contentPadd t_view">NUMBER 2</div> 
<div class="contentPadd l_view">NUMBER 3</div> 

Answer 1

Я написал обработчик куки, которые вы можете найти здесь: http://forrst.com/posts/JavaScript_cookie_handler-JE9

Чтобы использовать его, создать новый экземпляр объекта Ovenmitts. Затем передайте два параметра методу bakeCookie: имя и значение. В вашей click функции, выполните следующие действия:

$('a.row_view').click(function() { 
    var cookieObj = new Ovenmitts(); 
    cookieObj.bakeCookie('opened', 'a.row_view'); 
    $('.contentPadd.r_view').css('display', 'block'); 
    $('.contentPadd.l_view').css('display', 'none') 
    $('.contentPadd.t_view').css('display', 'none'); 
}); 

Затем, на странице загрузки, вызовите admireCookie метод:

$(document).ready(function() { 
    var cookieObj = new Ovenmitts(); 
    var cookie = cookieObj.admireCookie('opened'); 
    if (cookie === 'a.row_view') { 
    $('.contentPadd.r_view').css('display', 'block'); 
    $('.contentPadd.l_view').css('display', 'none') 
    $('.contentPadd.t_view').css('display', 'none'); 
    } 
}); 

Позвольте мне знать, если у вас есть какие-либо вопросы, реализующие это.

Кроме того, вместо .css('display', 'block') и .css('display', 'none') вы можете использовать JQuery .show() и .hide() функции.

Вы можете перезаписать файл cookie, вызвав метод bakeCookie и передать его с тем же именем (например, «открыт»). Таким образом, вы можете передать значение, чтобы помнить, какой ящик открыт.

Answer 2

Благодаря Нику.

1. создать или добавить это в файл .js:

   // обработчик куки для листинга макетов // для создания экземпляра нового объекта, создать переменную и вызвать новый оператор // например, var myCookie = новый Ovenmitts(); // затем вы можете получить доступ к методам Ovenmitts через myCookie.bakeCookie() и т. д. var Ovenmitts = function() {var ctx = это; // создаем файл cookie // принимает 3 параметра: имя, значение, дней // cookie принимает пару ключ/значение для имени/значения, истекает/ дней // дней является необязательным, по умолчанию используется конец сеанса ctx.bakeCookie = функция (имя, значение, дни) { if (days) { var date = new Date(); дата.setTime (дата.getTime() + (дни * 24 * 60 * 60 * 1000)); var expires = "; expires =" + date.toGMTString(); } else {var expires = ""; } return document.cookie = name + "=" + значение + expires + "; path = /"; }; // читает файл cookie // принимает параметр имени ( первое значение в файле cookie) ctx.admireCookie = function (name) { var nameEQ = name + '='; var ca = document.cookie.split (';'); для (var i = 0; i < ca.length; i + = 1) { var c = ca [i]; while (c.charAt (0) === '') {c = c.substring (1, c.length); } if (c.indexOf (nameEQ) === 0) {return c.substring (nameEQ.length, c.length); } } null null; }; }; // завершение обработчика cookie.

   $ (документ) .ready (функция() {// Товарное расположение DIV переключатель
   $ ('a.row_view') нажмите (функция() {вар cookieObj = новый Ovenmitts();. cookieObj .bakeCookie ('open', 'a.row_view'); $ ('. contentPadd.r_view'). show(); $ ('. contentPadd.l_view'). hide(); $ ('. contentPadd .t_view ') скрыть();.});

   $ (' a.list_view ') нажмите (функция() {вар cookieObj = новый Ovenmitts();. cookieObj.bakeCookie (' открыл '' a.list_view '); $ ('. contentPadd.r_view '). hide(); // horizontal $ ('. ContentPadd.l_view'). Show(); // list $ ('. contentPadd.t_view'). hide(); // thumbnails});
   $ ('a.table_view'). Click (function() {var cookieObj = new Ovenmitts(); cookieObj.bakeCookie ('open', 'a.table_view'); $ ('. ContentPadd.r_view') .hide(); $ ('. contentPadd.l_view'). hide(); $ ('. contentPadd.t_view'). show();}); var cookieObj = new Ovenmitts(); var cookie = cookieObj.admireCookie ('открыт'); if (cookie === 'a.row_view') { $ ('. contentPadd.r_view'). show(); $ ('. ContentPadd.l_view'). Hide(); $ ('. ContentPadd.t_view'). Hide(); } var cookieObj = new Ovenmitts(); var cookie = cookieObj.admireCookie ('открыто'); if (cookie === 'a.list_view') { $ ('. contentPadd.r_view'). hide(); // horizontal $ ('. contentPadd.l_view'). show(); // list $ ('. contentPadd.t_view'). hide(); // thumbnails} var cookieObj = new Ovenmitts(); var cookie = cookieObj.admireCookie ('открыто'); if (cookie === 'a.table_view') { $ ('. contentPadd.r_view'). hide(); $ ('ContentPadd.l_view.) Скрывать(). $ ('. ContentPadd.t_view'). Show(); } // END Товарное раскладку переключатель деление с

2. добавил это к моей странице test.html. Кроме того, добавить файл JS:

<script language="javascript" src="YOURJSFILE.js"></script> 
    <script language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js.js"></script> 

<a class="row_view">TEST 1</a>&nbsp;&nbsp; 
<a class="list_view">TEST 2</a>&nbsp;&nbsp; 
<a class="table_view">TEST 3</a> 

1. добавил это к моей странице test.html

<div class="contentPadd r_view">TEST 1</div> 
<div class="contentPadd t_view">TEST 2</div> 
<div class="contentPadd l_view">TEST 3</div> 

это так. - ДОБАВИТЬ В PHP -ADD ИЗОБРАЖЕНИЯ - РАСШИРЯТЬ - И т.д.