@RoadMoscow

Как сделать для нескольких блоков «показать еще»?

Здравствуйте. Подскажите пожалуйста как реализовать для нескольких блоков "показать еще"?
Если такой контейнер один, тогда все работает отлично, а когда несколько .container тогда они или не работают или открываются/закрываются вместе
<div class="container">
							<div id="button">Показать ещё</div>
							<div id="block" style="display: none;">
								Какой-то скрытый текст 1
							</div>>
						</div>
						<div class="container">
							<div id="button">Показать ещё</div>
							<div id="block" style="display: none;">
								Какой-то скрытый текст 2
							</div>>
						</div>


Такой jQuery
$(function() {

	$('#button').on('click', function(e) {
		$('#block').slideToggle(function() {
		  console.log($(e.target).is(':visible'));
		  $(e.target).text($(this).is(':visible') ? 'Скрыть' : 'Показать еще');
		});
	});

});
  • Вопрос задан
  • 103 просмотра
Решения вопроса 1
PavelMonro
@PavelMonro
<div class="container">
              <div class="button">Показать ещё</div>
              <div class="block" style="display: none;">
                Какой-то скрытый текст 1
              </div>>
            </div>
            <div class="container">
              <div class="button">Показать ещё</div>
              <div class="block" style="display: none;">
                Какой-то скрытый текст 2
              </div>>
            </div>

$(function() {

  $('.button').on('click', function(e) {
    $(this).next('.block').slideToggle(function() {
      console.log($(e.target).is(':visible'));
      $(e.target).text($(this).is(':visible') ? 'Скрыть' : 'Показать еще');
    });
  });

});
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы