Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   запоминание положения отрытости/закрытости менюшки (https://javascript.ru/forum/jquery/3543-zapominanie-polozheniya-otrytosti-zakrytosti-menyushki.html)

czar 30.04.2009 19:19

запоминание положения отрытости/закрытости менюшки
 
делаю меню с "детьми".всё классно, всё выпадает и сворачивается(тут ничего сложного нет)
$('.withChildren span').click(function(e){
		e.preventDefault();
		var ul = $(this).parent().find('ul');
		ul.toggle('slow');
	});

<ul>
	<li><a href = "/">Новости</a></li>
	<li class="withChildren"><span class="asA">Сотрудники</span>
		<ul>

			<li><a href = "/staff/index/list">Список</a></li>
			<li><a href = "/staff/index/emails">Электронные адреса</a></li>
		</ul>
	</li>
</ul>

теперь надо сделать чтобы при обновлнеии страницы запоминалось положения открытости или закрытости меню...нашёл плугин для jquery который использует куки.
пока что не пробовал его, но один факт что это возможно - радует.

интересует как отследить положение ветки?
то есть как мне увидить(какой атрибут-селектор) нужно искать, чтобы получить инфу о том открыта или закрыта ветка меню.
пробовал
ul.css('visibility')

но всё время выдаёт что видно.

e1f 01.05.2009 03:14

Вешайте при сворачивании/разворачивании класс -- типа expanded/collapsed, по наличию и определяйте:
$('.withChildren span').click(function(e){
        e.preventDefault();
        var ul = $(this).parent().find('ul');
        ul.toggleClass('expanded').toggleClass('collapsed').toggle('slow');
});

d-_-b 02.05.2009 14:37

при обновлении страницы повешенные js-ом классы конечно же пропадут - от куков скорей всего не отделаться

e1f 02.05.2009 18:35

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

czar 03.06.2009 17:02

вернулся к этому вопросу.. использую плагин jquery.cookie.js
$('.accordion li ul').hide();

if($.cookie('openedmenu') != null) $('.accordion li ul#'+$.cookie('openedmenu')).show();
$('.accordion span.asA').click(function(e){
	
	if($.cookie('openedmenu') === null || $(this).next().attr('id') != $.cookie('openedmenu'))
	{
		$.cookie('openedmenu',$(this).parent().find('ul').attr('id'));
		$('.accordion li ul').hide('slow');
		$(this).parent().find('ul').show('slow');
		
	}
});


таких блочков у меня идёт несколько
<ul class="accordion">
	<li><a href = "/news/list.html">Новости</a></li>
	<li><span class="asA">Сотрудники</span>	
		<ul id="menu2" >
			<li><a href = "/staff/list.html">Список</a></li>
			<li><a href = "/photos/list.html">Фотографии</a></li>

			<li><a href = "/staff/emails.html">Emails</a></li>
			<li><a href = "/photos/department/22.html">Совет директоров</a></li>
		</ul>
	</li>
	<li><span class="asA">Библиотека</span>	
		<ul id="menu53" >
			<li><a href = "/documents/1.html">Документы</a></li>
			<li><a href = "/documents/2.html">Разное</a></li>

		</ul>
	</li>
	<li><a href = "/web-sites.html">Web сайты компании</a></li>
	<li><a href = "/board/list.html">Доска объявлений</a></li>
	<li><a href = "/wi-fi.html">Wi-Fi для гостей</a></li>
</ul>


в общем какойто бокопроство присходит:
при раскрівании и клацании на ссылки внутри открытого блока бывате так что при переходе страницы открывается совершенно тругой блок!!!

ps: ну и сам вопрос, почему так происходит???

Олег 03.06.2009 23:06

Цитата:

Сообщение от e1f (Сообщение 18058)
Ну это естественно, тут либо куки либо на сервер-сайде запоминать

Да, вот, например, так можно без куки и серверов там всяких (если, конечно, автоматом не надо на сервере разворачивать меню при запросе пользователя), вечно с этими закрытиями\открытиями и менюшками или списками так и норовят в куки залезть http://browserpersistence.ru/ , или, через текст после # можно запоминать, там где-то плагин для jquery специальный был.

Kolyaj 03.06.2009 23:17

Олег,
вам кук чтоли жалко?

Олег 03.06.2009 23:30

Да

Kolyaj 04.06.2009 00:02

Так отключите.

czar 04.06.2009 10:46

поскольку проект надо было срочно сдавать выкрутился запоминанием в сессии на сервере
$('.accordion li ul').hide();
$.ajax({
	type: "POST",
	url: "/index/menuposition/",
	dataType: 'json',
	//data: "name=John&location=Boston",
	success: function($data){
	 //alert( $data[0] );
		if($data !== null )
		{
			$('.accordion li ul#'+$data[0]).show();
		}
	}

});


//if($.cookie('openedmenu') !== null) $('.accordion li ul#'+$.cookie('openedmenu')).show();
$('.accordion span.asA').click(function(e){
	
	var id = $(this).parent().find('ul').attr('id').toString();
	
	$.ajax({
		type: "POST",
		url: "/index/menuposition/",
		data: "id="+id,
		success: function($data){
			//var $id = $data[0];
		}

	});
	
	$('.accordion li ul:visible').hide('slow');
	$(this).parent().find('ul').show('slow');
	
});

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

x-yuri 05.06.2009 22:56

имхо самый нормальный вариант - делать это на сервере, причем хранить ничего не надо, просто есть текущая страница и соответствующий пункт нужно выделить
p.s. естественно не через ajax


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