Для получения полного доступа
зарегистрируйтесь

jQuery toggle с сохраненим состояния в localStorage


Пример использования:

<div><a href="javascript:;" data-target="#block" data-olabel="Скрыть подробности" data-clabel="Подробнее" id="toggle_save"></a></div>
<div id="block" style="display: none;">
Подробности...
</div>
$('#toggle_save').toggleSave();

(function( $ ){
    // значение по умолчанию
    var defaults = {
        open_label: 'Скрыть подробности',
        close_label: 'Подробнее'
    };

    // наши публичные методы
    var methods = {
        // инициализация плагина
        init:function(params) {
            // актуальные настройки, будут индивидуальными при каждом запуске
            var options = $.extend({}, defaults, params);

            var target = this.data('target');
            var open_label = this.data('olabel') || options.open_label;
            var close_label = this.data('clabel') || options.close_label;
            var isVisible = false;

            this.click(function(){
                $(target).toggle();

                isVisible = $(target).is(":visible");
                localStorage.setItem('visible'+target, isVisible);
                methods.label(this, isVisible, options);
            });

            isVisible = localStorage.getItem('visible'+target) === 'false' ? false : true;
            methods.check(this, target, options);
        },
        check:function(el, target, options){
            var isVisible = localStorage.getItem('visible'+target) === 'false' ? false : true;
            $(target).toggle(isVisible);
            methods.label(el, isVisible, options);
        },
        label:function(el, isVisible, options){
            if(isVisible){
                $(el).html(options.open_label);
            } else {
                $(el).html(options.close_label);
            }
        }
    };

    $.fn.toggleSave = function(method) {
        // немного магии
        if ( methods[method] ) {
            // если запрашиваемый метод существует, мы его вызываем
            // все параметры, кроме имени метода прийдут в метод
            // this так же перекочует в метод
            return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
        } else if ( typeof method === 'object' || ! method ) {
            // если первым параметром идет объект, либо совсем пусто
            // выполняем метод init
            return methods.init.apply( this, arguments );
        } else {
            // если ничего не получилось
            $.error( 'Метод "' +  method + '" не найден в плагине jQuery.mySimplePlugin' );
        }
    };

})( jQuery );

Чтобы увидеть комментарии, нужно быть участником сообщества

Регистрация