代码之家 › 专栏 › 技术社区 › Tom Kidd

我可以将一个javascript变量传递到另一个浏览器窗口吗?

browser javascript

Tom Kidd · 技术社区 · 16 年前

我有一个页面产生一个弹出浏览器窗口。我在父浏览器窗口中有一个javascript变量,我想将它传递到弹出的浏览器窗口。

有办法吗?我知道这可以在同一个浏览器窗口中的帧之间完成,但我不确定是否可以在浏览器窗口之间完成。

13 回复 | 直到 16 年前

MarkR 16 年前

如果窗口来自同一个安全域,并且您引用了另一个窗口,是的。

javascript的open()方法返回对已创建窗口(如果重用现有窗口,则返回现有窗口)的引用。以这种方式创建的每个窗口都会得到一个应用于它的属性“window.opener”,指向创建它的窗口。

然后,可以使用DOM(取决于安全性)访问另一个的属性,或者它的文档、框架等。

Victor 9 年前

将代码放到问题上,您可以从父窗口执行此操作:

var thisIsAnObject = {foo:'bar'};
var w = window.open("http://example.com");
w.myVariable = thisIsAnObject;

或者从新窗口:

var myVariable = window.opener.thisIsAnObject;

我更喜欢后者,因为您可能需要等待新页面加载,这样您就可以访问它的元素,或者您想要的任何内容。

bobince 16 年前

是的,脚本可以访问同一域中其他窗口的属性(通常通过window.open/opener和window.frames/parent获得)。调用在另一个窗口上定义的函数通常更容易管理,而不是直接处理变量。

然而,Windows可能会死掉或继续运行,浏览器处理它的方式也会有所不同。检查车窗(A)是否仍然打开(!window.closed)和(b)在您尝试调用它之前具有您期望的可用功能。

字符串之类的简单值很好,但通常在窗口之间传递函数、DOM元素和闭包等复杂对象不是一个好主意。如果子窗口从其打开器存储对象,则打开器将关闭,该对象可能“死”(在某些浏览器(如IE)中)或导致内存泄漏。可能会出现奇怪的错误。

Roman M 11 年前

在窗口之间传递变量(如果您的窗口位于同一域中)可以通过以下方式轻松完成:

曲奇饼
本地存储。只需确保您的浏览器支持localstorage,并执行变量维护权限(添加/删除/删除)以保持localstorage干净。

Grant Wagner 16 年前

在父窗口中:

var yourValue = 'something';
window.open('/childwindow.html?yourKey=' + yourValue);

然后在childwindow.html中:

var query = location.search.substring(1);
var parameters = {};
var keyValues = query.split(/&/);
for (var keyValue in keyValues) {
    var keyValuePairs = keyValue.split(/=/);
    var key = keyValuePairs[0];
    var value = keyValuePairs[1];
    parameters[key] = value;
}

alert(parameters['yourKey']);

在分析键/值对时,可能会进行大量的错误检查,但这里不包括。也许有人可以在后面的答案中提供更具包容性的javascript查询字符串解析例程。

knut 11 年前

您可以很容易地传递变量和引用父窗口中的内容:

// open an empty sample window:
var win = open("");
win.document.write("<html><body><head></head><input value='Trigger handler in other window!' type='button' id='button'></input></body></html>");

// attach to button in target window, and use a handler in this one:
var button = win.document.getElementById('button');

button.onclick = function() {
     alert("I'm in the first frame!");   
}

Brault Gilbert 8 年前

可以将消息从“父”窗口传递到“子”窗口:

在“父窗口”中打开子窗口

    var win = window.open(<window.location.href>, '_blank');    
       setTimeout(function(){
                    win.postMessage(SRFBfromEBNF,"*")
                  },1000);
    win.focus();

根据上下文替换的

在“孩子”中

    window.addEventListener('message', function(event) {
        if(event.srcElement.location.href==window.location.href){
        /* do what you want with event.data */
        }
    });

必须根据上下文更改if测试

Jordan Mack 16 年前

是的,只要两个窗口都在同一个域中,就可以执行此操作。函数的作用是:返回一个新窗口的句柄。子窗口可以使用dom元素“opener”访问父窗口。

Milan BabuÅ¡kov 16 年前

或者,您可以将它添加到URL中,让脚本语言(php、perl、asp、python、ruby等)在另一端处理它。类似:

var x = 10;
window.open('mypage.php?x='+x);

singe3 9 年前

我一直在努力将论点成功地传递到新打开的窗口。
我想到的是:

function openWindow(path, callback /* , arg1 , arg2, ... */){
    var args = Array.prototype.slice.call(arguments, 2); // retrieve the arguments
    var w = window.open(path); // open the new window
    w.addEventListener('load', afterLoadWindow.bind(w, args), false); // listen to the new window's load event
    function afterLoadWindow(/* [arg1,arg2,...], loadEvent */){
        callback.apply(this, arguments[0]); // execute the callbacks, passing the initial arguments (arguments[1] contains the load event)
    }
}

示例调用:

openWindow("/contact",function(firstname, lastname){
    this.alert("Hello "+firstname+" "+lastname);
}, "John", "Doe");

活生生的例子

http://jsfiddle.net/rj6o0jzw/1/

Community CDub 7 年前

你可以使用 window.name 作为Windows之间的数据传输,它也跨域工作。虽然没有官方支持,但据我所知,实际上跨浏览器工作得很好。

More info here on this Stackoverflow Post

-1

LAT 13 年前

是浏览器清除窗口的所有引用。因此,您必须在主窗口中搜索某个类的类名,或者使用cookies作为javascript自制的参考。

我的项目页面上有一台收音机。然后你打开收音机,它从一个弹出窗口开始,我控制主页上的主窗口链接,显示播放状态,在FF IT__________但这是可以做到的。

-2

HappySmileMan 16 年前

如果您对创建的窗口有一个引用,那么window.open()函数也将允许这样做,前提是它在同一个域中。如果在服务器端使用该变量,则应使用$_会话变量(假设您使用的是PHP)。