Jquery Accordion, держите открытым выбранным при обновлении/изменении страницы

Я пробую этот код для своего jquery Accordion

        (function(jQuery){
         jQuery.fn.extend({  
             accordion: function() {       
                return this.each(function() {

                    var $ul = $(this);

                    if($ul.data('accordiated'))
                        return false;

                    $.each($ul.find('ul, li>div'), function(){
                        $(this).data('accordiated', true);
                        $(this).hide();
                    });

                    $.each($ul.find('a'), function(){
                        $(this).click(function(e){
                            activate(this);
                            //alert(this);
                            return void(0);
                        });
                    });
                    var sPath = window.location.pathname;
                    var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
                    var findvar=sPage;
                    var active = (findvar)?$(this).find('a[href='+ findvar + ']')[0]:'';

                    if(active){
                        activate(active, 'toggle');
                        $(active).parents().show();
                    }

                    function activate(el,effect){
                        $(el).parent('li').toggleClass('active').siblings().removeClass('active').children('ul, div').slideUp('fast');
                        $(el).siblings('ul, div')[(effect || 'slideToggle')]((!effect)?'fast':null);
                    }

                });
            } 
        }); 
    })(jQuery);

Но когда я обновляю страницу, все аккордеоны рушатся. Но я хочу этого, когда обновляю страницу. Держите выбранный Аккордеон открытым, потому что мой Аккордеон — это боковая навигация, помещенная в Включить (php). поэтому один файл php для всей боковой навигации Accordion, поэтому всякий раз, когда я нажимаю на меню, страница должна меняться и оставлять выбранный Accordion открытым.


javascript jquery accordion jquery-ui jquery-ui-accordion
person Shivam Pandya    schedule 01.10.2013    source источник
comment
вам нужно будет установить файл cookie, который записывает, открыт или закрыт аккордеон. затем, когда страница загружается, прочитайте файл cookie и соответственно откройте/закройте аккордеон. Взгляните на плагин jquery.cookie.   -  person Mike Oram    schedule 01.10.2013
comment
@MikeOram, спасибо, Майк, можете ли вы предоставить ссылку или источник для него и как установить файл cookie. ? для этого нужен JqueryUI?   -  person Shivam Pandya    schedule 01.10.2013
comment
Конечно, вы можете загрузить его с github, в ридми на этой странице есть все инструкции по установке и использованию, это довольно просто: github.com/carhartl/jquery-cookie   -  person Mike Oram    schedule 01.10.2013
comment
@MikeOram Есть ли рабочий пример, использующий Jquery Cookie?   -  person Shivam Pandya    schedule 01.10.2013
comment
На днях я написал этот скрипт, который делает в основном то, что вы хотите, я верю. По крайней мере, он показывает, как использовать jquery.cookie jsfiddle.net/pBN9x.   -  person Mike Oram    schedule 01.10.2013
comment
@MikeOram Спасибо, я постараюсь вернуться к вам в ближайшее время   -  person Shivam Pandya    schedule 01.10.2013

Ответы (3)


arrow_upward
0
arrow_downward

Ему не нужно использовать файл cookie, он может использовать веб-хранилище: http://www.w3schools.com/html/html5_webstorage.asp

person andygoestohollywood    schedule 01.10.2013
comment
Как я использую это в своем коде? Извините, но я новичок в Jquery. Так что, если бы вы могли, чем спасибо - person Shivam Pandya; 01.10.2013
comment
хотя веб-хранилище быстрее и безопаснее, чем файлы cookie, оно не поддерживается ‹IE8, поэтому зависит от требований поддержки. - person Mike Oram; 01.10.2013

arrow_upward
0
arrow_downward

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

person Serjik    schedule 01.10.2013

arrow_upward
0
arrow_downward

Если вы хотите сохранить выбранные данные аккордеона для этого конкретного сеанса, вы можете использовать любой из методов хранения в следующем порядке.

1. Локальное хранилище HTML 5

2. Файл cookie

3. Скрытое поле

//Для сохранения выбранного значения в течение длительного времени.

4. База данных (вы можете использовать вызов ajax для сохранения значения в базе данных)

затем проверьте, есть ли какое-либо сохраненное значение в документе, и сделайте этот аккордеон открытым

$(document.ready(function(){
var selectedaccordianId = $("#hidSavedAccordinId").val();

 if($.trim(selectedaccordianId) != "")
{
 $("#" + selectedaccordianId).show(); 
}
}));
person sudhAnsu63    schedule 01.10.2013