Как реализовать событие click?

Question

[Виталий]

Нужно, чтоб при нажатии на стрелочки и/или на надпись "ПОКАЗАТЬ ВСЕ" выполнялось одинаковое действие. А именно:
1) Стрелочки показывали вверх (transform: rotate(180deg);)
2) Надпись менялась на "Скрыть"
3) Добавлялись несколько скрытых пунктов li списка ul. На бутстрапе они имеют класс .hidden
И при повторном нажатии все менялось обратно.
$('.arrow, .button').click(function(){
$('.arrow i').css('transform', 'rotate(180deg)'),
$('.toggle_list li.hidden').toggle('.hidden');
});

Answer 1

[iBird Rose]

$('.arrow, .button').click(function(){
$('.arrow i').css('transform', 'rotate(180deg)'),
$('.toggle_list li.hidden').toggle('hidden');
$('.pokaz-vse').text(function(i,text) {
			return text === "СКРЫТЬ" ? "ПОКАЗАТЬ ВСЕ" : "СКРЫТЬ";
		});
});

p.s. а вообще в иделае тебе надо в скрипте просто класс какой нить туглить типа "active" - а все стили уже делать в css

Comments

[Ankhena]

Поддержу то, что в "p.s.". Toggle при нажатии добавляет/убирает класс скажем к основному блоку товара. А в CSS все трансформации.

[Виталий]

1) в таком раскладе текст тогглится, но не тогглятся стрелки. То есть, при повторном клике стрелки не поворачиваются еще на 180град. Они остаются повернутыми вверх.
2) Если я кликаю на кнопку, то действие происходит со всеми четырьмя элементами, а происходить должно с одним блоком. Здесь наверное надо использовать this, но не получается.
3) Собственно, сами скрытые элементы не разворачиватся/сворачиваются :(

Answer 2

[Виталий]

1) в таком раскладе текст тогглится, но не тогглятся стрелки. То есть, при повторном клике стрелки не поворачиваются еще на 180град. Они остаются повернутыми вверх.
2) Если я кликаю на кнопку, то действие происходит со всеми четырьмя элементами, а происходить должно с одним блоком. Здесь наверное надо использовать this, но не получается.
3) Собственно, сами скрытые элементы не разворачиватся/сворачиваются :(
ul class="toggle_list">
div class="arrow">
li>Игрушки для малышей
li>Игрушки для мальчиков
li>Игрушки для девочек
li>Мягкие игрушки
li class="hidden">Игрушки для малышей
li class="hidden">Игрушки для мальчиков
li class="hidden">Игрушки для девочек
li class="hidden">Мягкие игрушки
/ul
ПОКАЗАТЬ ВСЕ-->