Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Как частично скрыть элементы многоуровневого списка (https://javascript.ru/forum/jquery/72801-kak-chastichno-skryt-ehlementy-mnogourovnevogo-spiska.html)

ksa 28.02.2018 08:35

Как вариант...

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='https://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
#script_menu > li > ul {
	display: none;
}
#script_menu > li.on > ul {
	display: block;
}
</style>
<script type='text/javascript'>
$(function(){
	$('#script_menu > li > a').click(function(){
		$('#script_menu > li.on')
		.removeClass('on')
		.children('ul').hide();
		$(this).parent()
		.addClass('on')
		.children('ul').show();
		return false;
	});
	$('#script_menu > li > ul > li > a').click(function(){
		alert($(this).text());
		return false;
	});
});
</script>
</head>
<body>
<ul id="script_menu">
	<li>
		<a class="selected" href="">Department1</a>
		<ul>
			<li>
				<a href="">Centrales</a>
			</li>
			<li>
				<a href="">Klaviaturos centralems</a>
			</li>
			<li>
				<a href="">Sirenos</a>
			</li>
		</ul>
	</li>
	<li>
		<a class="" href="">Department2</a>
		<ul>
			<li>
				<a href="">Konvencines sistemos</a>
			</li>
			<li>
				<a href="">Adresines sistemos</a>
			</li>
			<li>
				<a href="">Autonomines sistemos</a>
			</li>
		</ul>
	</li>
	<li>
		<a class="selected_a" href="">Department3</a>
		<ul>
			<li>
				<a href="">IP Kameros</a>
			</li>
			<li>
				<a href="">TURBO Kameros</a>
			</li>
			<li>
				<a href="">HD Kameros</a>
			</li>
		</ul>
	</li>
	<li class="on">
		<a class="" href="">Department4</a>
		<ul>
			<li>
				<a href="">12V AC/DC</a>
			</li>
			<li>
				<a href="">24V AC/DC</a>
			</li>
			<li>
				<a href="">220V AC</a>
			</li>
		</ul>
	</li>
</ul>
</body>
</html>

ТвердолобыйЛамер 28.02.2018 22:28

Огромнейшее спасибо, но мне даже неудобно писать , но это тоже не то. Откройте подменю , и нажмите F5 , страница перезагружается и подменю закрывается . Извините , но мой вариант с filter на класс работает так , как мне нужно.
Еще раз искренне благодарен за оказанную помощь . Спасибо . Хорошего дня . !!!!! :thanks: :thanks: :thanks:

ТвердолобыйЛамер 28.02.2018 22:30

P.S Но все Ваши примеры я положил в копилочку. Они ждут своего часа. :dance: :victory: :thanks:

ksa 01.03.2018 08:46

Цитата:

Сообщение от ТвердолобыйЛамер
Откройте подменю , и нажмите F5 , страница перезагружается и подменю закрывается .

Если ты хочешь, чтобы действия сохранялись и восстанавливались - нужно подключать серверный ЯП или записывать информацию на клиенте в куки или локальное хранилище. ;)

ТвердолобыйЛамер 01.03.2018 10:19

Цитата:

Сообщение от ksa (Сообщение 479501)
Если ты хочешь, чтобы действия сохранялись и восстанавливались - нужно подключать серверный ЯП или записывать информацию на клиенте в куки или локальное хранилище. ;)

Все это понятно , но я не понимаю зачем так усложнять? Чем плох вариант , с применением фильтра перед скрытием элементов?
При загрузке страницы меню полностью закрыто . А при выборе какой то группы , скрываются элементы за исключением выбранной группы. Это то , что мне было нужно в данный момент. И я не вижу смысла в написании лишнего кода .
Если я ошибаюсь , то пожалуйста поправьте меня , только желательно обосновать .
Спасибо . :)

ksa 01.03.2018 10:36

Цитата:

Сообщение от ТвердолобыйЛамер
я не виожу смысла в написании лишнего кода

Дело твое...

ТвердолобыйЛамер 01.03.2018 10:44

Цитата:

Сообщение от ksa (Сообщение 479504)
Дело твое...

Спасибо за содержательный ответ. :thanks:
Хорошего дня. :thanks:


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