FancyBox iframe возвращает parent.$ как неопределенное (с использованием WordPress)

Я пытаюсь закрыть FancyBox из iframe, но parent.$ всегда равно undefined. Это мой iframe JavaScript:

 <script type='text/javascript' 
  src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'>
 </script>
 <script type="text/javascript">
 jQuery(document).ready(function($){
     (function($) {
         $.fn.closeFancyBox = function() {
             $(this).click(function() {
                 parent.$.fancybox.close();
             });
         };
      })(jQuery);
      $('#cancel').closeFancyBox();
      });
 });
 </script>

Замена parent.$.fancybox.close(); на alert('clicked'); работает нормально. Я не понимаю, почему parent.$ это undefined, когда iframe находится в том же домене.

Я использую WordPress 2.9.1 с плагином FancyBox для Wordpress.

  • главная страница: //server.local/web/test/index.php
  • iframe-страница: //server.local/web/test/wp-content/plugins/wp-test/test.htm

Первый из этих URL-адресов — главная страница, второй — страница iframe; server.local — мой домашний тестовый сервер.

Любые идеи? Я могу вставить весь исходник, если это будет полезно.


wordpress iframe jquery undefined fancybox
person Aleksandr    schedule 09.02.2010    source источник

Ответы (9)


arrow_upward
7
arrow_downward

Он не определен, поскольку WordPress запускает jQuery в режиме noConflict. Используйте это вместо этого:

parent.jQuery.fancybox.close();

Режим noConflict означает, что $ не равно jQuery. Вы должны явно использовать jQuery для доступа к тому, что вы обычно можете получить с помощью $.

person Doug Neiner    schedule 09.02.2010
comment
Извините, я должен был сказать, что знаю об этом; js, который я включил, был фрагментом. Я отредактировал свой вопрос, чтобы отразить это: передача $ означает, что мне не нужно использовать «jQuery». - person Aleksandr; 09.02.2010
comment
@Aleksandr Передача $ в iframe вообще не повлияет на родительскую страницу. Фактически вы включаете совершенно отдельный экземпляр jQuery в файл iframe. Если вы заметили, что вы написали, вы пропускаете $, но ссылаетесь на parent.$. Это как если бы у вас было var a = 1; alert(obj.a);. Вы бы не ожидали, что два элемента будут ссылаться на одно и то же значение, если бы где-то в коде не было присваивания. - person Doug Neiner; 09.02.2010
comment
Вы правы, это имеет смысл. Однако, используя следующий код: jQuery('#cancel').click(function(){ parent.jQuery.fancybox.close(); }); я все еще получаю undefined ошибок в Firebug: parent.jQuery.fancybox is undefined. У вас есть идеи, почему это может быть? Спасибо за вашу помощь! Я все еще новичок в JavaScript и программировании в целом. - person Aleksandr; 09.02.2010
comment
@Aleksandr Александр Я сейчас на работе, но я попробую решение, когда у меня будет возможность, и обновлю свой ответ результатами. - person Doug Neiner; 09.02.2010

arrow_upward
5
arrow_downward

Мой ответ не относится к wordpress, а относится к fancybox в целом.

в iframe, если вы включили основной скрипт jquery (jquery-1.5.2.min.js), то он будет конфликтовать со скриптом на главной странице, и parent.$.fancybox будет не работает в этом случае.

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

person The Humble Coder    schedule 02.09.2011

arrow_upward
3
arrow_downward

Я должен был сделать это:

окно.верхнее.окно.$.fancybox.close();

Получил ошибку типа раньше.

person TOBlender    schedule 09.05.2011

arrow_upward
3
arrow_downward

Любые варианты parent.fancybox.close() у меня не работали, должно быть, какой-то конфликт с библиотекой.

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

parent.jQuery('#fancybox-overlay').css('display', 'none');
parent.jQuery('#fancybox-wrap').css('display', 'none');
person stasl    schedule 15.05.2011
comment
Лучший взлом. Спасибо! - person emen; 01.07.2015

arrow_upward
1
arrow_downward

Это работает для меня ;)

<a href="javascript:parent.jQuery.fn.fancybox.close();" >

Спасибо за этот пост, он на самом деле немного помог мне... Мне плохо, потому что это заняло у меня всего несколько минут, и я ЗНАЮ, как разочаровывает Fancybox для Wordpress!!

person Michael    schedule 13.07.2010

arrow_upward
1
arrow_downward

Ни одно из предложений не сработало для меня. Мне пришлось обойти это, используя следующий код. Последняя версия может поддерживать функцию parent.jQuery.fancybox.close(); подход, но старые версии с ним не работают.

Для существующих сайтов со старыми версиями плагинов/Jquery попробуйте это

function close_window()
{
 $("#fancy_outer",window.parent.document).hide();
 $("#fancy_overlay",window.parent.document).hide();
 //window.top.window.$.fancybox.close(); this also does not work :(
}

вы можете объявить и использовать функцию close_window в содержимом Iframe.

person Community    schedule 10.08.2010

arrow_upward
1
arrow_downward

У меня была такая же проблема, и я заметил, что я не использую

type:'iframe'

При вызове fancybox это решило мою проблему

person Hammad    schedule 20.01.2012

arrow_upward
0
arrow_downward

Потратил несколько часов, пытаясь отладить это, и ничего не добился. Поэтому я заменил плагин "FancyBox for WordPress" на последнюю версию FancyBox, и это было исправлено. Надо было попробовать это раньше.

Проведя некоторое время с WordPress и его различными плагинами, я бы рекомендовал вызывать вещи вручную, а не полагаться на плагины. Это просто добавляет еще один уровень сложности, которого, если вы знаете, что делаете, не должно быть.

Спасибо Дугу за указание на правильный синтаксис для iframe для родительского окна jQuery в WordPress.

person Aleksandr    schedule 13.02.2010

arrow_upward
0
arrow_downward

Привет! Всем, у кого возникли проблемы с закрытием iFrame Fancy Box при ручной установке Fancy Box в Wordpress 3.0:

Используйте эту ссылку в вашем iframe:

<a href="#" onClick="parent.jQuery.fancybox.close();" title="Close window">close fancybox</a>

Оно работает :)

person dave    schedule 16.07.2010