Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 21.04.2014, 15:38
Кандидат Javascript-наук
Отправить личное сообщение для Зосимов Посмотреть профиль Найти все сообщения от Зосимов
 
Регистрация: 11.02.2013
Сообщений: 102

Добавить появляющийся блок
Всем привет.
Я делаю добавление контента посредством JS -
$('ul').append(
		'<li><div id="line1">' + val.club + '</div><div class="detail">То что будет показано при клике</div></li>');


а вот дивку с классом detail я хотел бы показывать при нажатии по кнопке
$(".btn").click(function(){ 
        $('.detail').slideToggle("fast");
   });


Но дело в том, что у меня много линий (li), а показать detail мне нужно именно для той, где была кликнута кнопка.

Подскажите пожалуйста - возможно ли так сделать?
Ответить с цитированием
  #2 (permalink)  
Старый 21.04.2014, 15:48
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Зосимов,
а где кнопа btn?
Ответить с цитированием
  #3 (permalink)  
Старый 22.04.2014, 07:14
Кандидат Javascript-наук
Отправить личное сообщение для Зосимов Посмотреть профиль Найти все сообщения от Зосимов
 
Регистрация: 11.02.2013
Сообщений: 102

Сообщение от рони Посмотреть сообщение
Зосимов,
а где кнопа btn?
<li><button class="btn">кнопка</button><div id="line1">' + val.club + '</div><div class="detail">То что будет показано при клике</div></li>


может даже тут быть.
но суть в том, что бы открыть для каждой строки свой deatail
Ответить с цитированием
  #4 (permalink)  
Старый 22.04.2014, 08:02
Профессор
Отправить личное сообщение для krasovsky Посмотреть профиль Найти все сообщения от krasovsky
 
Регистрация: 21.12.2012
Сообщений: 869

При твоей разметке такой код
$(".btn").click(function(){
        $(this).parent().find('.detail').slideToggle("fast");
   });
Ответить с цитированием
  #5 (permalink)  
Старый 22.04.2014, 08:15
Кандидат Javascript-наук
Отправить личное сообщение для Зосимов Посмотреть профиль Найти все сообщения от Зосимов
 
Регистрация: 11.02.2013
Сообщений: 102

Сообщение от krasovsky Посмотреть сообщение
При твоей разметке такой код
$(".btn").click(function(){
        $(this).parent().find('.detail').slideToggle("fast");
   });
сори. немного изменил код, так как с кнопкой почему то не работает.
сделал так
$('ul.'+liDay).append(
		'<li><div id="line1">Название клуба</div><br /><div class="detail">То что будет показано при клике</div></li>'); 
          });
    });

   $("li").click(function(){ 
     $(this).parent().find('.detail').slideToggle("fast");
   });


но в этом случае, показываются все detail для всех li при клике (
Ответить с цитированием
  #6 (permalink)  
Старый 22.04.2014, 08:20
Кандидат Javascript-наук
Отправить личное сообщение для Зосимов Посмотреть профиль Найти все сообщения от Зосимов
 
Регистрация: 11.02.2013
Сообщений: 102





вот так получается при клике на строку ..
Ответить с цитированием
  #7 (permalink)  
Старый 22.04.2014, 12:48
Профессор
Отправить личное сообщение для krasovsky Посмотреть профиль Найти все сообщения от krasovsky
 
Регистрация: 21.12.2012
Сообщений: 869

Сообщение от Зосимов Посмотреть сообщение
сори. немного изменил код, так как с кнопкой почему то не работает.
сделал так
$('ul.'+liDay).append(
		'<li><div id="line1">Название клуба</div><br /><div class="detail">То что будет показано при клике</div></li>'); 
          });
    });

   $("li").click(function(){ 
     $(this).parent().find('.detail').slideToggle("fast");
   });


но в этом случае, показываются все detail для всех li при клике (
ну так убери парент )) Совсем не смотрел код что ли )
$("li").click(function(){ 
     $(this).find('.detail').slideToggle("fast");
   });
Ответить с цитированием
  #8 (permalink)  
Старый 24.04.2014, 09:41
Кандидат Javascript-наук
Отправить личное сообщение для Зосимов Посмотреть профиль Найти все сообщения от Зосимов
 
Регистрация: 11.02.2013
Сообщений: 102

Сообщение от krasovsky Посмотреть сообщение
ну так убери парент )) Совсем не смотрел код что ли )
спасибо большое.

а не можете подсказать - почему все таки клик по кнопке в данном случае не работает?

$('ul.'+liDay).append(
        '<li><div id="line1">Название клуба</div><br /><div class="detail">То что будет показано при клике</div><button class="btn">Показать</button></li>);
          });
    });
 
   $(".btn").click(function(){
    $(this).find('.detail').slideToggle("fast");
   });


может кнопка так сказать появляется позже, и на нее не привязывается событие клик?
Ответить с цитированием
  #9 (permalink)  
Старый 24.04.2014, 09:57
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от Зосимов
$(this).find('.detail').
$(this).prev().
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Копирование блоков в блок maximus Events/DOM/Window 1 14.09.2013 19:40
Как добавить блок зума не переж body а в необходимый блок? ilyas-> Элементы интерфейса 0 30.07.2013 15:27
Скрыть/показать блок в зависимости от radio MBmusic Элементы интерфейса 10 08.05.2013 17:23
Добавить блок в хтмл код LuckyD Events/DOM/Window 1 27.03.2013 03:35
Появляющийся блок при нажатии на ссылку Morgam jQuery 9 07.10.2012 08:14