使用jquery创建新窗口

时间:2010-10-21 17:44:30

标签: javascript jquery

我正在使用JavaScript / jQuery开发一个小项目。

为了显示在javascript中完成的计算结果,我想打开一个包含一些预定义内容的新窗口并修改此内容以显示结果:我使用如下代码:

var resultwindow = window.open('result.html')
var doc = $('body', resultwindow.document);
doc.append("<p>Result</p>")

这是行不通的,因为在我追加内容时尚未加载结果文档,因此它会被'result.html'的内容覆盖。

我也试过

$(resultwindow.document).ready(function() {
    // ... Fill result document here
})

$(resultwindow.document).load(function() {
    // ... Fill result document here
})

ready()仅适用于当前文档(如果已加载当前文档,则会立即调用它),并且根本不会调用load

也许有人可以指出我正确的方向。提前谢谢!

修改

我终于通过在Javascript中“手动”创建新文档解决了这个问题:

w = window.open('','newwinow','width=800,height=600,menubar=1,status=0,scrollbars=1,resizable=1);
d = w.document.open("text/html","replace");
d.writeln('<html><head>' +
  '<link rel="stylesheet" type="text/css" href="style.cs"/></head>' +
  +'<body></body></html>');
// use d to manipulate DOM of new document and display results

如果我今天要做同样的事情(两年以后的经验),我会使用一些Javascript模板库,如Handlebars来维护模板并将其编译为javscript。

3 个答案:

答案 0 :(得分:2)

您的load电话无效,因为您正在尝试处理document的加载,此时文档甚至可能不存在。这意味着你将null传递给jQuery,它优雅地忽略了你。相反,处理原始窗口引用的load事件,然后你应该好好去...

var win = window.open("result.html");
$(win).load(function() {
  $("body").append("<p>Result</p>");
});

答案 1 :(得分:1)

您遇到的问题是load()没有按照您的想法行事。

相反,请使用bind("load", function() { /* Your function here */ });,然后应该工作。


<强>校正:

load()实际上是一个双用途函数 - 如果用函数作为第一个参数调用它,那么它会将它绑定到相关对象(或对象)的load事件,否则它会加载将数据(如果有的话)返回到有问题的元素中。请参阅Josh关于真实原因的答案。

答案 2 :(得分:0)

将数据发送到查询字符串中的result.html,然后让result.html显示数据。如果你想要不那么明显,你可以在查询字符串中散列数据并让结果页面去掉它。