如何将文本添加到 Javascript 中的弹出窗口 window?

How to add text to a pop up window in Javascript?

我正在创建一个简历生成器,一个人可以在其中输入信息到输入字段,我的 javascript 代码将获取字段值并将其写入弹出窗口 window,这将是他们的恢复。我显然在这里做了一些严重错误的事情。我可以打开弹出窗口 window,但弹出窗口 window 中没有我从 javascript 附加的文本。

我将展示代码片段,因此我不会发布完整的文档,但一切都遵循相同的规则。

我输入的代码html:

<body>
    <!-- Full name -->
    <p><strong>Enter your full name:</strong></p>
    <input type="text" name="fullName" cols='75'><br>

    <!-- Address -->
    <p><strong>Enter your address:</strong></p>
    <input type="text" name="address">
     .
     .
     .
</body>

Html 对于我的弹出 window:

<body>
    <div id="name"></div>

    <div id="address/phone"></div>

    <hr>

    <div class="theLeft" id="objectives_pop"></div>

    <div class="theRight" id="objectivesText"></div>
    .
    .
    .
</body>

Javascript:

function myWindow() {
    window.open("popupWindow.html", "_blank", "height=500", "width=500", "left=100", "top=100", "resizable=yes", "scrollbars=yes",
    "toolbar=yes", "menubar=no", "location=no", "directories=no", "status=yes");

    // Name
    var name = document.getElementById('fullName').value;
    document.getElementById('name').innerHTML = name;

    // Address and phone number
    var address = document.getElementById('address').value;
    var phoneNum = document.getElementById('phoneNum').value;
    document.getElementById('address/phone').innerHTML = address + '/' + phoneNum;
    .
    .
    .

我想将主 html 文件 (project.html) 中输入字段的文本附加到 popupWindow.html 中的弹出窗口 window。我该怎么做?

您可以在弹出对话框中添加类似 <div id="dialog" title="Basic dialog" style="display: none;">Insert text</div> 的内容!

在您当前的代码片段中,您调用的是主页上的 document.getElementById,而不是弹出窗口。您首先需要将弹出窗口 window 作为变量获取,然后根据需要对其进行修改。

要开始,请尝试执行以下操作:

let myPopup = window.open("popupWindow.html", "_blank", "height=500", "width=500", "left=100", "top=100", "resizable=yes", "scrollbars=yes",
    "toolbar=yes", "menubar=no", "location=no", "directories=no", "status=yes");

myPopup.onload = function() {
    var name = document.getElementById('fullName').value;
    myPopup.document.getElementById('name').innerHTML = name
}

这将打开一个新的弹出窗口 window,等待它加载,然后更改该弹出窗口的名称 innerHTML,而不是父页面。

您正在使用 document.getElementById() 但在您的 html 上输入实际上没有 ID,它们有名称,您的 html 应该是:

<p><strong>Enter your full name:</strong></p>
<input type="text" id="fullName" cols='75'><br>

<!-- Address -->
<p><strong>Enter your address:</strong></p>
<input type="text" id="address">