@Royorso

Как разделить вызов функции для разных div?

Есть страница.
На ней есть ссылка:
<a href="#tabs_set_order" rel="bookmark" class="order_base"><div class="adw-button">Заказать в кредит</div></a>

которая вызывает форму заявки с помощью вот такого скрипта:
<script type="text/javascript">
		jQuery(document).ready(function() {		
			var orderTitle = 'Проект «<?php the_title(); ?>»';
			jQuery('#credit-project-name').val(orderTitle);
			document.getElementById("input_proj_name").innerHTML = orderTitle;
			jQuery("title_order_send").val(orderTitle);
			
			jQuery('.order_base').magnificPopup({
				type: 'inline',
				preloader: false,
				focus: '#order_name',
				tClose: 'Закрыть (Esc)',
				tLoading: 'Загрузка...',

				// When elemened is focused, some mobile browsers in some cases zoom in
				// It looks not nice, so we disable it:
				callbacks: {
					beforeOpen: function() {
						if(jQuery(window).width() < 700) {
							this.st.focus = false;
						} else {
							this.st.focus = '#order_name';
						}
					}
				}
			});
		});
	</script>


Также на этой странице (в левом sidebar) есть ссылка:
<a href="#tabs_set_order" rel="bookmark" class="order_calc" id="calc-button">
	<div class="calc-button">Калькулятор<br>проекта<img src="/wp-content/uploads/2015/03/calc_house_80px.png"></div>
</a>

которая вызывает другую форму, но с использованием практически того же скрипта:
<script type="text/javascript">
		jQuery(document).ready(function() {
			jQuery('.order_calc').magnificPopup({
				type: 'inline',
				preloader: false,
				focus: '#order_name',
				tClose: 'Закрыть (Esc)',
				tLoading: 'Загрузка...',

				// When elemened is focused, some mobile browsers in some cases zoom in
				// It looks not nice, so we disable it:
				callbacks: {
					beforeOpen: function() {
						if(jQuery(window).width() < 700) {
							this.st.focus = false;
						} else {
							this.st.focus = '#order_name';
						}
					}
				}
			});
		});
	</script>


Разница только в селекторе: jQuery('.order_base') и jQuery('.order_calc') соответственно.

Проблема: когда на странице только ссылка из левого сайдбара (.order_calc), то форма вызывается, всё в порядке, но когда две ссылки на одной странице (как по линку в начале сообщения), то форма по ссылке из левого sidebar перестаёт работать.

Вопрос: как разделить эти скрипты, чтобы вызывались две разных формы?

P.S.: js вот этот.
  • Вопрос задан
  • 603 просмотра
Решения вопроса 1
webset
@webset
Frontend developer
Вы можете только 1 раз использовать id, это уникальный идентификатор. Селектор соответственно используйте различные id.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Rsa97
@Rsa97
Для правильного вопроса надо знать половину ответа
То есть на странице два раза устанавливается обработчик jQuery(document).ready() ? Тогда при установке обработчика во второй раз предыдущий будет потерян.
Ответ написан
Ваш ответ на вопрос

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

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