将值/变量从fancybox iframe 传递给父级 [英] pass value/variable from fancybox iframe to parent

问题描述

我试图将一个变量/值从fancybox iframe 传递到父窗口，但没有成功.

I'am trying to pass a variable/ value from the fancybox iframe to the parent window without success.

Fancybox 是从带有

Fancybox is launched from a link with

   class="fancybox fancybox.iframe"

我在fancybox.iframe 中的代码是:

My code in the fancybox.iframe is:

$(document).ready(function(){
   $('.insert_single').click(function(){
    var test =  $('.members_body').find('{row.U_USERNAME}');
    setTimeout(function(){ parent.$.fancybox.close();},300);return true;

   });
});

其中{row.U_USERNAME}"是要在 iframe 中找到的用户名.

Where '{row.U_USERNAME}' is the username to find in the iframe.

然后，在父级中有以下代码:

Then, in the parent there's the following code:

 $(document).ready(function(){
 $('.fancybox').fancybox(

  {
openEffect:'fade',
openSpeed:500,


    afterClose: function(){
    alert($(".fancybox-iframe").contents().find(test)); 
    $('#form input[name=username]').val()(test);return false;
    }
}                   

  );
 });

但是当fancybox关闭时，变量test"不会出现警告，变量也不会在表单的输入字段中显示为值或文本.

But when the fancybox is closed, there's no alert showing up with the variable "test", nor the variable is showing up as a value or as a text in the input field of the form.

我已经阅读并尝试了在 stackoverflow 上找到的各种解决方案，但都没有成功.

I've read and tried various solutions found here on stackoverflow without success.

提前感谢您的帮助

编辑

这是一个示例

推荐答案

当fancybox 关闭时，iframe 从文档中移除.所以你必须使用 beforeClose 事件而不是 afterClose

When the fancybox is closed the iframe is removed from the document. So you must use beforeClose event instead of afterClose

$(document).ready(function() {
    $('a.fancybox').fancybox({
        openEffect:'fade',
        openSpeed:500,
        beforeClose: function() {
            // working
            var $iframe = $('.fancybox-iframe');
            alert($('input', $iframe.contents()).val());
        },
        afterClose: function() {
            // not working
            var $iframe = $('.fancybox-iframe');
            alert($('input', $iframe.contents()).val());
        }
    });
});

JSFiddle:http://jsfiddle.net/NXY7Y/1/

我编辑了你的 jsfiddle(http://jsfiddle.net/NXY7Y/9/).更新在此链接中http://jsfiddle.net/NXY7Y/13/

I edited your jsfiddle (http://jsfiddle.net/NXY7Y/9/). Update is in this link http://jsfiddle.net/NXY7Y/13/

主页 javascript:

Main page javscript:

$(document).ready(function() {
    $('a.fancybox').fancybox({
        openEffect:'fade',
        openSpeed:500//,
        //beforeClose: function() {
        //    // working
        //    var $iframe = $('.fancybox-iframe');
        //    alert($('input', $iframe.contents()).val());
        //},
        //afterClose: function() {
        //    // not working
        //    var $iframe = $('.fancybox-iframe');
        //    alert($('input', $iframe.contents()).val());
        //}
    });
});

function setSelectedUser(userText) {
    $('#username').val(userText);
}

无需使用 afterClose 或 beforeClose 事件.只需在链接点击事件上从 iframe 访问父函数 setSelectedUser，如下所示:

No need to use afterClose or beforeClose events. Just access the parent function setSelectedUser from the iframe on link click event like this:

$(document).ready(function() {
    $('a.insert_single').click(function() {
        parent.setSelectedUser($(this).text());
        parent.$.fancybox.close();
    });
});

这篇关于将值/变量从fancybox iframe 传递给父级的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！