Создать ответ 
JQuery - многоразовое использование показа/скрытия блока (toggle)
Автор Сообщение
Булат Азат улы Не на форуме
Младший сержант
*

Сообщений: 22
У нас с: Mar 2016
Сообщение: #1
JQuery - многоразовое использование показа/скрытия блока (toggle)
У меня на странице должны быть много блоков, которые должны показываться и скрываться при клике на абзац, которые стоят выше них. (Например, кликаем на "Читать далее" и открывается блок, который был скрыт в CSS. Таких "Читать далее" на сайте множество).
Так вот, я написал для них функцию
Код:
$("#fd").click(function(){
    $("#text8").toggle(1000);
});
, но по этому коду у меня работает только первая кнопка "Читать далее", а остальные не действуют. Пробовал так:
Код:
$("#fd").click(function(){
    $(this + "#text8").toggle(1000);
});
(то есть хотел написать, что функция должна выполняться тому элементу, которая стоит после "this" (т. е. абзац с идентификатором "fd")) - после этого кода вообще ни один из "Читать далее" не работает.
А если так:
Код:
$("#fd").click(function(){
    $("#fd + #text8").toggle(1000);
});
, то при щелчке на любую из "Читать далее" открываются сразу все блоки.
Подскажите пожалуйста, где что нужно приписать? Help
03.04.2016 12:46:10
Найти все сообщения Цитировать это сообщение
Admin Не на форуме
Верховный
Главнокомандующий
(Administrator)
*

Сообщений: 2,431
У нас с: Aug 2011
Сообщение: #2
RE: JQuery - многоразовое использование показа/скрытия блока (toggle)
А у Вас все блоки и абзацы имеют одинаковые id? Так быть не должно. Допускается иметь одинаковые классы, но не id!

Не посмотрев код конечно тяжело что-то менять, поэтому попробуйте добавить абзацам какой-нибудь класс (например, class="fd") и изменить JS код на такой:
Код:
$(".fd").click(function(){
     $(this).next().toggle(1000);
});
03.04.2016 13:49:48
Найти все сообщения Цитировать это сообщение
Булат Азат улы Не на форуме
Младший сержант
*

Сообщений: 22
У нас с: Mar 2016
Сообщение: #3
RE: JQuery - многоразовое использование показа/скрытия блока (toggle)
Эмм.. да... Вот это я лоханулся Fool Пол часа сидел - все идентификаторы в HTML и CSS в классы переводил.
Ваш код работает, как надо Smile Спасибо большое и за код, и за подсказку об идентификаторах. Узнал бы позже - пришлось бы тысячи идентификаторов переименовывать в классы By

И еще один вопрос задам уж в этой теме, хотя и темой не совсем подходит: нет ли других похожих функций, как toggle, отличающиеся только методом показа/скрытия блока? А то сейчас содержимое у меня раскрывается горизонтально (сначала увеличивается основной блок (блок, в котором находится сворачиваемый блок), а потом слева направо раскрывается "text8"). А мне хотелось бы, чтобы и "text8" раскрывался сверху вниз, как основной блок.
(Последний раз сообщение было отредактировано 03.04.2016 в 15:07:09, отредактировал пользователь Булат Азат улы.)
03.04.2016 15:00:37
Найти все сообщения Цитировать это сообщение
Admin Не на форуме
Верховный
Главнокомандующий
(Administrator)
*

Сообщений: 2,431
У нас с: Aug 2011
Сообщение: #4
RE: JQuery - многоразовое использование показа/скрытия блока (toggle)
Попробуйте slideToggle() и fadeToggle().
03.04.2016 15:10:07
Найти все сообщения Цитировать это сообщение
Булат Азат улы Не на форуме
Младший сержант
*

Сообщений: 22
У нас с: Mar 2016
Сообщение: #5
RE: JQuery - многоразовое использование показа/скрытия блока (toggle)
slideToggle() как раз подходит, спасибо!!! Wink
03.04.2016 15:56:34
Найти все сообщения Цитировать это сообщение
Создать ответ 


Переход:


Пользователи просматривают эту тему: 1 Гость(ей)


LiveInternet
© Copyright 2011-2024 by UsefulScript.ru