JS: Одна всплывающая форма и разные заголовки

Каждый раз, создавая или оптимизируя сайты, всегда сталкиваюсь с задачами, которые можно и нужно оптимизировать, сокращать, минимизировать и так далее. Например, вы хотите сделать на лендинге 5 форм, у которых по сути отличается только заголовок. Неужели вы будете лепить все 5 форм? Не надо! Можно обойтись несколькими строчками кода.

  1. Дадим заголовку вашей формы идентификатор
<h2 id="windowHeader">Ваш заголовок формы</h2>
  1. Повесим на ваши кнопки названия заголовка каждой из них. Например, для обратного звонка — «Обратный звонок», для бесплатной консультации — «Бесплатная консультация»:
<a onClick="windowHeader('Бесплатная консультация');">Заказать бесплатную консультацию</a>
<a onClick="windowHeader('Обратный звонок');">Заказать звонок</a>
  1. Создадим JS функцию, которая при нажатии той или иной кнопки будет подменять нам название формы:
function windowHeader(name) {
          document.getElementById('windowHeader').innerHTML = name;
}
  1. Жамкаем по кнопкам, смотрим на форму.
Поделиться
Отправить
2018   js
Популярное