Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Fancybox - передать значение в iframe (https://javascript.ru/forum/jquery/54229-fancybox-peredat-znachenie-v-iframe.html)

spo 10.03.2015 07:18

Спасибо, настроил и как обычно есть одно маленькое НО.

У меня сразу после загрузки DOM окна, запускается функция которая работает с этим классом "show". И получается что она срабатывает перед назначением класса.

Я пробовал вместо afterLoad поставить beforeLoad, но тогда конечно приведенный вами пример не будет работать.

В общем получается что клик по ссылке находится в index.html а функция обрабатывающая класс show в test.html

dd_smol 10.03.2015 07:46

Все то же что описано выше плюс можно немного уточнить какой именно фрейм брать если он на страницы не один.
$('iframe[src$=' + el.href + ']')

spo 10.03.2015 07:50

dd_smol, фрейм то один test.html

dd_smol 10.03.2015 08:02

Цитата:

Сообщение от spo (Сообщение 360447)
dd_smol, фрейм то один test.html

Сегодня один, а завтра появится другой это всего на всего мера предосторожности.
Можно пример функции, которая раньше времени отрабатывает.

spo 10.03.2015 10:36

dd_smol, вот примерно так:
function init() {...}	
google.maps.event.addDomListener(window, 'load', init);

dd_smol 10.03.2015 13:06

События load не подходит для запуска функции так как класс еще не добавлен к параграфу.
Может попробовать запустить функцию после добавления класса?

jQuery(function($) {
	$('a[rel]').each(function(i, el) {
		$(this).fancybox( {
			href : el.href,
			type: "iframe",
			afterLoad: function() {
				var winFrame = $('iframe[src$="' + el.href + '"]')[0].contentWindow;

                $( winFrame.document ).find('.' + $(el).attr('rel')).addClass('show');

				// Запустить функцию после добавления класса
				winFrame.init();
            }
		});
		
	});
});


http://learn.javascript.ru/play/sOxOx

spo 10.03.2015 21:51

dd_smol, событие load взято из примера google maps api.
В том то и дело что во фрейме код google map, который в зависимости от того какому элементу назначен класс curr, устанавливает на карте метки из одного или другого массивов.

На главной странице (index.html) две ссылки "карта компании" и "диллеры", при клике на которые всплывает окно (map.html).
В файле map.html находятся две ссылки аналогичные тем что в файле index.html и код добавляющий карту.
В данном коде есть проверка какая из двух ссылок имеет класс curr.

Таким образом в index.html
<a rel="a" class="fancybox.iframe" href="map.html">a</a>
<a rel="b" class="fancybox.iframe" href="map.html">b</a>

и js
$('a[rel]').each(function(i, elem) {
	$(this).fancybox({
		afterLoad: function() {$($('iframe')[0].contentWindow.document).find('.' + $(elem).attr('rel')).addClass('curr')}
	})
});

В map.html
<a class="a" href="#">a</a>
<a class="b" href="#">b</a>

и js
function init() {
	// google maps code
	coords();
}
function coords() {if($('.a').hasClass('curr')) {coords1()} else {coords2()}}
google.maps.event.addDomListener(window, 'load', init);

рони 10.03.2015 21:57

spo,
google.maps.event.addDomListener(window, 'load', window.setTimeout(init, 1000));

spo 10.03.2015 22:37

рони, такое решение не хотелось использовать

dd_smol 11.03.2015 07:35

А если обернуть вызов метода в промежуточную функцию и вызвать ее по тому принципу что я предложил выше?

function testFunc() {
	google.maps.event.addDomListener(window, 'load', init);
}


jQuery(function($) {
	$('a[rel]').each(function(i, el) {
		$(this).fancybox( {
			href : el.href,
			type: "iframe",
			afterLoad: function() {
				var winFrame = $('iframe[src$="' + el.href + '"]')[0].contentWindow;

                $( winFrame.document ).find('.' + $(el).attr('rel')).addClass('show');

				// Запустить функцию после добавления класса
				winFrame.testFunc();
            }
		});
		
	});
});


Часовой пояс GMT +3, время: 16:18.