2010-09-14 5 views
0

Я пытаюсь вызвать функцию всплывающего окна jQuery из iframe.Как я могу назвать эту функцию jQuery из iframe?

В моем внешнем .js, который включен в моем родительском фрейме у меня есть это:

(function($){   
    $.fn.popupWindow = function(instanceSettings){ 

     return this.each(function(){ 

     $(this).click(function(){ 

     $.fn.popupWindow.defaultSettings = { 
      centerBrowser:0, // center window over browser window? {1 (YES) or 0 (NO)}. overrides top and left 
      centerScreen:0, // center window over entire screen? {1 (YES) or 0 (NO)}. overrides top and left 
      height:500, // sets the height in pixels of the window. 
      left:0, // left position when the window appears. 
      location:0, // determines whether the address bar is displayed {1 (YES) or 0 (NO)}. 
      menubar:0, // determines whether the menu bar is displayed {1 (YES) or 0 (NO)}. 
      resizable:0, // whether the window can be resized {1 (YES) or 0 (NO)}. Can also be overloaded using resizable. 
      scrollbars:0, // determines whether scrollbars appear on the window {1 (YES) or 0 (NO)}. 
      status:0, // whether a status line appears at the bottom of the window {1 (YES) or 0 (NO)}. 
      width:500, // sets the width in pixels of the window. 
      windowName:null, // name of window set from the name attribute of the element that invokes the click 
      windowURL:null, // url used for the popup 
      top:0, // top position when the window appears. 
      toolbar:0 // determines whether a toolbar (includes the forward and back buttons) is displayed {1 (YES) or 0 (NO)}. 
     }; 

     settings = $.extend({}, $.fn.popupWindow.defaultSettings, instanceSettings || {}); 

     var windowFeatures = 'height=' + settings.height + 
           ',width=' + settings.width + 
           ',toolbar=' + settings.toolbar + 
           ',scrollbars=' + settings.scrollbars + 
           ',status=' + settings.status + 
           ',resizable=' + settings.resizable + 
           ',location=' + settings.location + 
           ',menuBar=' + settings.menubar; 

       settings.windowName = this.name || settings.windowName; 
       settings.windowURL = this.href || settings.windowURL; 
       var centeredY,centeredX; 

       if(settings.centerBrowser){ 

        if ($.browser.msie) {//hacked together for IE browsers 
         centeredY = (window.screenTop - 120) + ((((document.documentElement.clientHeight + 120)/2) - (settings.height/2))); 
         centeredX = window.screenLeft + ((((document.body.offsetWidth + 20)/2) - (settings.width/2))); 
        }else{ 
         centeredY = window.screenY + (((window.outerHeight/2) - (settings.height/2))); 
         centeredX = window.screenX + (((window.outerWidth/2) - (settings.width/2))); 
        } 
        window.open(settings.windowURL, settings.windowName, windowFeatures+',left=' + centeredX +',top=' + centeredY).focus(); 
       }else if(settings.centerScreen){ 
        centeredY = (screen.height - settings.height)/2; 
        centeredX = (screen.width - settings.width)/2; 
        window.open(settings.windowURL, settings.windowName, windowFeatures+',left=' + centeredX +',top=' + centeredY).focus(); 
       }else{ 
        window.open(settings.windowURL, settings.windowName, windowFeatures+',left=' + settings.left +',top=' + settings.top).focus(); 
       } 
       return false; 
      }); 

     }); 
    }; 
})(jQuery); 

В моем родительском фрейме у меня есть это:

<script type="text/javascript" src="...jquery.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    $('.popit').popupWindow({ 
     height:350, 
     width:450, 
     centerBrowser:1 
    }); 
}); 
</script> 

Если я ставлю следующую строку в моем родительская рамка Я получаю ожидаемый результат - всплывающие функции:

<a href="http://www.bbc.co.uk" title="bbc.co.uk" class="popit" name="windowx">BBC<a/> 

Функция popupWindow ассоциируется с остроумием h класс popit - не проблема. Но как мне изменить вышеприведенный код, чтобы вызвать эту функцию из iframe, и что такое javascript в iframe для достижения этого?

+0

'вызвать эту функцию из iframe' вы имеете в виду, всплывающее Iframe или создать всплывающее при нажатии кнопки (или что-то событие) в IFRAME? – 2010-09-14 13:45:48

+0

Почему у вас нет Javascript и все на странице и просто используйте Javascript со страницы для управления iFrame? Швы более логичны и более прямолинейны. – Frankie

+0

В основном у меня есть приложение, работающее в iframe. Twitter разрывает iframe при попытке входа в систему из iframe, поэтому я делаю oauth во всплывающем окне. – Owen

ответ

1

Вот некоторые примеры кода для фрейма:

<html> 
<head> 
    <title>sample code</title> 
<script type="text/javascript" src="./scripts/jquery.js"></script> 
    <script> 
     (function($){   
      $.fn.popupWindow = window.parent.$.fn.popupWindow; 
     })(jQuery); 
    </script> 
    <script type="text/javascript"> 
     jQuery(document).ready(function(){ 
      jQuery('.popit2').popupWindow({ 
       height:550, 
       width:650, 
       centerBrowser:1 
      }); 
     }); 
    </script> 
</head> 
<body> 

<a href="http://stackoverflow.com" title="stackoverflow.com" class="popit2" name="windowx">stackoverflow.com<a/> 

</body> 
</html> 

Обратите внимание, как код доходя до родителя, чтобы установить функцию внутри фрейма для местного использования.

НТН

Смежные вопросы