Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   сохранение положения открыт/закрыт блока в localStorage. (https://javascript.ru/forum/misc/71724-sokhranenie-polozheniya-otkryt-zakryt-bloka-v-localstorage.html)

Sonic911 08.12.2017 13:43

сохранение положения открыт/закрыт блока в localStorage.
 
Всем Привет!

имеется скрипт:

$('.collapse-link').on('click', function () {
        var ibox = $(this).closest('div.ibox');
        var button = $(this).find('i');
        var content = ibox.children('.ibox-content');
        content.slideToggle(200);
        button.toggleClass('fa-arrows-v').toggleClass('fa-arrows-v');
        ibox.toggleClass('').toggleClass('border-bottom');
        setTimeout(function () {
            ibox.resize();
            ibox.find('[id^=map-]').resize();
        }, 50);
        var info;
        if(content.css("display") == none)
        {
            info = none;
        }
        else
        {
            info = ok;
        }
        localStorage.setItem(ibox.id,info);




    });


html блока:

<div class="ibox">
  <span class="collapse-link">
    <div  class="ibox-title">
        <h5 style="">Title</h5>
        <div class="ibox-tools">

                <i class="fa fa-arrows-v"></i>


        </div>
    </div>
    </span>
    <div id="block-1" class="ibox-content">
               Text
        
    </div>
</div>


И собственно скрипт при загрузке страницы:

$(document).ready(function() {
    var block1 = localStorage.getItem('block-1');
    if(block1 == none)
    {
        var ibox = getElementById("block-1");
        ibox.addClass("block-hide");
    }
    else:
    {
        continue;
    }
    });


На сайте имеются несколько блоков, состоящих из Заголовка и Контента.
Первоначально, при заходе на сайт пользователь видит и текст и заголовок. При клике(onClick скрипт) контент скрывается, при повторном - открывается. Я сохраняю в localStorage id блока и его текущее состояние. Далее при перезагрузке страницы я проверяю положение блока(открыт/закрыт), если он был скрыт(info = none) я добавляю class с display:none и скрываю его, в противном случае не делаю ничего. Js изучаю недавно, поэтому с большего хочу с этим разобраться, нежели просто получить ответ:) . Сам onClick скрипт без сохранения открыт/закрыт рабочий. В localStorage храниться массив из id+info.

Nexus 08.12.2017 13:54

Sonic911, в чем вопрос?)
ps. "none" и "ok" в строчках 15 и 19,13 соответственно нужно в кавычки занести, т.к. таких переменных вы скорее всего не создавали.
Что вы хотели сделать этой операцией?
ibox.toggleClass('').toggleClass('border-bottom');

Большинство методов jq возвращают ссылку на саму себя, поэтому строки 9-10 можно переписать так:
ibox.resize().find('[id^=map-]').resize();
//можно еще так попробовать:
ibox.find('[id^=map-]').addBack().resize();

Взаимодействие с localStorage лучше всего оборачивать в try catch, т.к. операция может завершиться фейлом по разным причинам.
После "else" двоеточие не ставится.
Если используете jQuery, то используйте его везде.
var ibox = getElementById("block-1");
ibox.addClass("block-hide");
//с jq:
$("#block-1").addClass("block-hide");

Sonic911 08.12.2017 14:09

Вопрос в том, что все это не работает. Не сохраняет положение блока и + не отображает на странице ничего, собственно кроме этого блока)
toggleClass грубо говоря добавляет класс border-bottom, брал из примера, не знаю, честно говоря, почему не addClass. По поводу строчки с resize(): весь код до var info рабочий, проверял отдельно, без сохранения положения.

рони 08.12.2017 14:15

Sonic911,
что такое
Цитата:

Сообщение от Sonic911
none

?

Sonic911 08.12.2017 14:22

в строке info = "none" - строка в которой я забыл кавычки поставить:)
В "display" == none - параметр style="display:none"

рони 08.12.2017 14:46

Sonic911,
https://javascript.ru/forum/dom-wind...tml#post407866

Sonic911 08.12.2017 15:08

Спасибо за пример, посмотрю. Как я понял, пример написан не через localStorage, а через печеньки. Возник вопрос, что лучше?) P.s Вопрос актуален

рони 08.12.2017 15:13

Sonic911,
лучше то, что вам проще.


Часовой пояс GMT +3, время: 20:40.