如何打开一个新窗口并使用 jQuery 将 html 插入其中？

IT技术 javascript jquery html
2021-02-06 14:29:05

我正在尝试从 javascript 打开一个新窗口，但没有在 html 中插入任何内容：

var callScriptText = $('#callScriptText').html();
var url = '/Action/CallScript/?callScript=';

// Open the current call script in a new window
var openWindow = window.open(url, 'callScriptPopup', 'width = 500, height = 500');
$(openWindow).html(callScriptText);

有谁知道为什么？

5个回答

这是使用 jQuery 打开包含内容的新窗口的示例

<script>
function nWin() {
  var w = window.open();
  var html = $("#toNewWindow").html();

    $(w.document.body).html(html);
}

$(function() {
    $("a#print").click(nWin);
});​
</script>

<div id="toNewWindow">
    <p>Your content here</p>
</div>

<a href="javascript:;" id="print">Open</a>​

编辑：对于那些说这段代码不起作用的人，这里有一个 jsfiddle 来试试http://jsfiddle.net/8dXvt/

很高兴来到这里。将我的问题设置为 OK，我的工作就在这里完成 :)
2021-03-23 14:29:05
如果您想要新窗口中的 URL，只需将 window.open 替换为window.open('/Action/CallScript/?callScript=', 'myWin', 'width = 500, height = 500');这将加载 URL 并将该名称设置到窗口中。您也可以删除该行var html=$("#toNewWindow").html();
2021-03-25 14:29:05
谢谢！但是我如何在其中添加一个 url 以便它不只是说 about:blank？
2021-03-31 14:29:05
您甚至还可以打开打印对话框： ` function nWin() { ` var w = window.open(); ` var html = $("#toNewWindow").html(); ` ` $(w.document.body).html(html); ` w.print(); ` w.close(); ` }
2021-04-09 14:29:05
有没有可能插入孔html（像下面的结构而不是从body中插入<html><head><title></title><script></script><body></body></html>）
2021-04-12 14:29:05

试试这个：

var x=window.open();
x.document.open();
x.document.write('content');
x.document.close();

我发现它适用于 Chrome 和 IE。

干净简单的解决方案
2021-03-14 14:29:05
这比 jQuery 解决方案更有效，因为您可以编写整个 HTML 文档，包括 doctype 和<head>标签。
2021-03-15 14:29:05
谢谢！@LucVH 添加到解决方案中，如果您的浏览器阻止了弹出窗口，您可以检查它是否添加if(!x) alert('Enable popups please!)源：链接
2021-03-25 14:29:05
在 Chrome 70 中似乎对我不起作用 - 打开新标签
2021-04-01 14:29:05
在我的 chrome 版本 51.0.2704.84 m 中不起作用。window.open() 之后的 x 返回 undefined 所以它没有文档
2021-04-06 14:29:05

基于@Emre 的回答。

使用javascript，你可以链接，所以我只是将代码修改为：

var x=window.open();
x.document.open().write('content');
x.close();

另外，要强制它进入新窗口（不是新选项卡），请给出第一行尺寸。但它必须是第三个参数。因此，将第一行更改为：

var x=window.open('','','width=600, height=600');
在过去的美好时光中，window.open 参数不能有空格：P
2021-03-21 14:29:05
该链接有点过于激进，document.write() 不返回任何内容，因此 Chrome 报告：Uncaught TypeError: Cannot read property 'close' of undefined。
2021-03-28 14:29:05
@jjrv，这不是积极的链接......你应该在链接之前先检查......例如， if(content!=='undefined'){x.document.open().write(content).close();}
2021-03-28 14:29:05
document.write() 总是返回 undefined，所以链式代码总是调用 undefined.close() 并且总是抛出一个错误。
2021-03-29 14:29:05

尝试：

var x = window.open('', '', 'location=no,toolbar=0');
x.document.body.innerHTML = 'content';
该问题专门要求使用 jquery 的解决方案。
2021-03-14 14:29:05
适用于 chrome 70
2021-03-26 14:29:05 
var codeContents = $("#contentsfornewWindow").html()
var win = window.open('', 'title', 'toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=1000,height=1000,left=200,top=70');

win.document.body.innerHTML = codeContents;

对比：

win.document.write(codeContents);

我注意到是否有像 youtubes 视频这样win.document.write的 iframe，在document.body.innerHTML没有的地方加载 iframe ！

你知道为什么吗？如何避免使用 document.write() 但仍然能够加载图像、iframe 等资源？
2021-03-23 14:29:05
其它你可能感兴趣的问题
上一篇更改按钮文本 onclick 下一篇如何使用 javascript 调用 ASP.NET c# 方法