Question

以下代码有效，但它取代了整个新窗口。

var v = window.open("popup.html" ... ); w.document.body.write("asd");

我有一个

<div id="insert-here"></div>

在我的popup.html中，我想插入我想要的文字。

此代码无效，我尝试了其他3种不同的方法，但没有运气：

$(w.document.body).find("#insert-here").append(msg);

我怎样才能实现它？我想避免在javascript中用css创建一个完整的html页面。

Answer 1

你能使用jQuery UI对话框吗？ https://jqueryui.com/dialog/

你可以在其中包含一些信息：

<div id="dialog" title="Basic dialog" style="display: none;">Some information</div>

然后你的jQuery可以相应地处理它：

$('#dialog').dialog();
$('#dialog').html("some other info");

请参阅此jsfiddle以获取示例：http://jsfiddle.net/gL3uZ/1/

Answer 2

Dunno，如果这是你正在寻找的东西。只需将url输入到弹出窗口并链接相同的css页面即可。您可以明显调整大小以满足您的需求。

function showPopup(url) {
            var newwindow=window.open(url,'name','height=220,width=560,top=200,left=300,resizable');
            if (window.focus) {
                newwindow.focus()
            }
        }

编辑/更新：尝试使用叠加层？

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title> blah </title>
</head>
<body>
<div id="copyme">hi there</div>
<button>click</button>
<script>
(function() { 
var copyme = document.getElementById('copyme').innerHTML;
    document.querySelector('button').addEventListener('click', function(e) {
        e.preventDefault();
    var overlayDiv = document.createElement('DIV'),
        overlay = overlayDiv.style; // DRY
        overlayDiv.id = 'overlay';
        overlay.height = window.innerHeight + "px";
        overlay.width = window.innerWidth + "px";
        overlay.top = window.pageYOffset + "px";
        overlay.left = window.pageXOffset + "px";
        overlay.background = 'rgba(0,0,0,0.8)';

    var popup = document.createElement('DIV'),
        popupCopy = document.createTextNode(copyme);
        popup.classList.add('popup');
        popup.style.color = 'white';
        popup.appendChild(popupCopy);

        overlayDiv.appendChild(popup);
        document.body.appendChild(overlayDiv);
    }, false);
})();
</script>
</body>
</html>

它的丑陋，但你可以添加调整大小或滚动侦听器并设置内部DIV的样式以查找你想要的方式。这就是我得到的全部！

Answer 3

好的，我发现了别的东西：

在我的popup.html中我需要一些javascript代码：

$( document ).ready(function() {
        console.log( "ready!" );
        $("#insert-here").append(opener.msg);
    });

这个开启者会从我的main.js文件中找到保存输入字段文本的变量msg。

如何使用javascript将文本插入格式化的弹出窗口？

3 个答案: