如何从iframe调用这个jQuery函数？

我试图从iframe中调用jQuery弹出窗口函数

在父框架中包含的external.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>

在我的父框架中，我有以下内容：

(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>

$（文档）.ready（函数（）{
$（'.popit'）.popupWindow（{
身高：350，
宽度：450，
centerBrowser:1
});
});

如果我在父帧中放置以下行，我将得到预期结果-弹出窗口有效：

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

英国广播公司

---

popupWindow函数与popit类关联-没问题。但是如何修改上述代码以便从iframe调用此函数，以及iframe中的javascript是如何实现这一点的？

以下是iframe的一些示例代码：

<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>

示例代码
（函数（$）{
$.fn.popupWindow=window.parent.$.fn.popupWindow；
})（jQuery）；
jQuery（文档）.ready（函数（）{
jQuery（'.popit2'）.popupWindow（{
身高：550，
宽度：650，
centerBrowser:1
});
});
stackoverflow.com

请注意，代码是如何到达父级以在iframe内部设置函数以供本地使用的

---

HTH

从iframe调用此函数

您的意思是，在单击iframe（或任何事件）时弹出iframe或创建弹出窗口？为什么不能将Javascript和所有内容都放在页面中，只使用页面中的Javascript来控制iframe？Seams更具逻辑性，更直截了当。基本上，我有一个在iframe中运行的应用程序。当您尝试从iframe登录oauth时，Twitter会破坏iframe，因此我将在弹出窗口中执行oauth。