Когда блок видим и нажимаешь на ту же самую ссылку (блок убирается)

@JIeuTo · Регистрация: 31.05.2018

Студворк — интернет-сервис помощи студентам

Доброе утро, подскажите как сделать, в этом коде реализована смена блока по клику (заменяя друг друга), но когда делаешь повторно клик по ссылке (на тот же самый блок), блок исчезает, можно ли сделать что бы блок оставался, а не исчезал, спасибо за помощь.

HTML5

<a href="#" onclick="openbox('box1'); return false">Записаться</a>
<a href="#" onclick="openbox('box2'); return false">Записаться</a>
 
<div class="block-of-text" id="box1" style="display: block;">Отображаемый блок 1</div>
<div class="block-of-text" id="box2" style="display: none;">Отображаемый блок 2</div>
<script>
function openbox(id) {
  var all = document.querySelectorAll(".block-of-text");
  for (var i = 0; i < all.length; i++) {
    if (all[i].id == id) {
      all[i].style.display = (all[i].style.display == 'none')? 'block' : 'none';
    } else {
      all[i].style.display = 'none';
    }
  }
}
</script>

@Rotersandik · 21.06.2018, 10:59

Возможно я чего-то не понимаю. Однако зачем вам 13-я строка кода вообще? В таком случаем попробуйте её удалить. Именно она убирает отображения всех блоков кроме того на ссылку которого нажали.

@JIeuTo · 21.06.2018, 11:14 **[ТС]**

Rotersandik, если эту строку убираю, то второй блок не заменяет первый, а появляется ниже

@Rotersandik · 21.06.2018, 11:15

Сообщение от Rotersandik

Возможно я чего-то не понимаю. Однако зачем вам 13-я строка кода вообще? В таком случаем попробуйте её удалить. Именно она убирает отображения всех блоков кроме того на ссылку которого нажали.

Поторопился с ответом. Просто вам когда вы нашли при переборе нужный блок необходимо не сменить его display, а присвоить block только в случае если он присвоен none:

HTML5

<a href="#" onclick="openbox('box1'); return false">Записаться</a>
<a href="#" onclick="openbox('box2'); return false">Записаться</a>
 
<div class="block-of-text" id="box1" style="display: block;">Отображаемый блок 1</div>
<div class="block-of-text" id="box2" style="display: none;">Отображаемый блок 2</div>
<script>
function openbox(id) {
  var all = document.querySelectorAll(".block-of-text");
  for (var i = 0; i < all.length; i++) {
    if (all[i].id == id) {
      if (all[i].style.display == 'none') {
          all[i].style.display = 'block'
         }
    } else {
      all[i].style.display = 'none';
    }
  }
}
</script>

@JIeuTo · 21.06.2018, 11:17 **[ТС]**

Rotersandik, благодарю, очень помогли

@Rotersandik 2 / 2 / 3 Регистрация: 17.09.2017 Сообщений: 38
	21.06.2018, 10:59	2
	Возможно я чего-то не понимаю. Однако зачем вам 13-я строка кода вообще? В таком случаем попробуйте её удалить. Именно она убирает отображения всех блоков кроме того на ссылку которого нажали. 0

@JIeuTo 0 / 0 / 0 Регистрация: 31.05.2018 Сообщений: 104
	21.06.2018, 11:14 [ТС]	3
	Rotersandik, если эту строку убираю, то второй блок не заменяет первый, а появляется ниже 0

@JIeuTo 0 / 0 / 0 Регистрация: 31.05.2018 Сообщений: 104
	21.06.2018, 11:17 [ТС]	5
	Rotersandik, благодарю, очень помогли 0

Опции темы

Когда блок видим и нажимаешь на ту же самую ссылку (блок убирается)

Решение