使用Javascript将值传递给子窗口 [英] Pass value to Child window using Javascript

查看:93
本文介绍了使用Javascript将值传递给子窗口的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试从父页面获取问题ID 并将其传递到我的新子页面。当子窗口获得响应时,它会将此数据放入 text_body id 。我已设法创建问题ID 并打开一个新窗口。但是,在将值传递给 text-body id 时出现错误。

I'm attempting to get the question id from the parent page and pass it into my new child page. When the child window gets a response it will put this data into text_body id. I have managed to create the question id and open a new window. However, I get an error when passing the value to text-body id.


无法将属性'value'设置为null。

Cannot set property 'value' of null.

我认为问题发生是因为JavaScript仍然检测到上一页,并且可以'重点关注新窗口。我在下面包含了我的源代码。

I think the problem happened because the JavaScript still detect the previous page, and can't focus into the new window. I have included my source code below.

function wait(ms){
    var start = new Date().getTime();
    var end = start;
    while(end < start + ms) {
        end = new Date().getTime();
    }
}

var body = document.getElementById('question').innerText;
alert(body);

var k = window.open("http://testing/support");
wait (2000);
k.focus();
wait (1000);
k.focus();
k.document.getElementById('text_body').value = body;


推荐答案

由于跨域限制,浏览器已经限制关于打开弹出窗口和iframe的安全性。

Due to cross-domain restrictions, browsers have clamped down on the security of opening pop-ups and iframes.

您获得的原因无法设置属性'value'为null 是您尝试运行代码直接从javascript打开一个窗口 - ,无需任何用户操作

The reason you are getting the Cannot set property 'value' of null is that you are trying to run the code to open a window directly from javascript - without any user action.

这会阻止代码正常运行,因此'上的'value'(属性或变量) ( k 子窗口)是你的错误;当您尝试设置变量'value'时, k 为空。

This will prevent the code running correctly, so the 'value' (property or variable) on null (k the child window) is your error; k is null at the time you are trying to set the variable 'value'.

浏览器会请求以不同方式允许弹出窗口的权限。如果用户没有点击要求弹出窗口的内容,则尚未授予许可权。

Browsers will request permission to allow pop-ups in different ways. If the user hasn't clicked on something to request the pop-up, permission hasn't yet been given to allow it.

下面的示例代码表明您将获取初始调用的错误以打开窗口并在没有用户操作的情况下设置子项的变量,但是当用户点击某些内容时( div 在这种情况下),它将在确认权限后打开。

The sample code below demonstrates that you will get the error for the initial call to open the window and set the child's variable without user action, but when the user clicks on something (the div in this case), it will open after confirming permission.

打开控制台窗口,刷新页面,你会看到非错误-interactive call。

Open the console window, refresh the page and you will see the error for the non-interactive call.

演示的工作部分使用初始值显示在子窗口中,然后1.5秒后,将调用中的一个函数来更新显示,最后是 parent 将访问子变量并直接设置显示。

The working parts of the demo use an initial value to display in the child window, then after 1.5 seconds, the parent will call a function in the child that will update the display, and finally, the parent will access a child variable and set the display directly.

定时器只是为了清楚地看到发生的变化。

Timers are just for clarity to see the changes as they happen.

希望这个封面你想做什么...

Hopefully this covers what you are trying to do...

parentPage.html:

<html>

<head>
    <title>Parent Page</title>
</head>

<body>
    <div id="divQuestion" onclick="openChild()">Parent text</div>

    <script>
        function openChild() {
            var parentText = document.getElementById("divQuestion").innerText;
            var win = window.open("childPage.html");

            // Call a function in the child window...    
            setTimeout(function () { win.changeValue(parentText) }, 1500);

            // Directly use a variable in the child window...
            setTimeout(function () { win.childText.innerText = body + " and some more..." }, 3000);
        }

        // By calling directly you are attempting to open a child window 
        // without user permission - this will fail.
        // openChild();
    </script>
</body>

</html>

childPage.html:

<html>

<head>
    <title>Child Page</title>
</head>

<body>
    <div id="divText">Child text</div>

    <script>
        var childText = document.getElementById("divText");

        function changeValue(val) {
            // Take a value from elsewhere (parent window in this case) and update the div
            childText.innerText = val;
        }
    </script>
</body>

</html>

这篇关于使用Javascript将值传递给子窗口的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆