6

JavaScript 中的一个简单任务是打开一个新窗口并在其中写入。但是我需要写一个 dom 元素，一个带有 ID 的 div。

var novoForm = window.open("somform.html", "wFormx", "width=800,height=600,location=no,menubar=no,status=no,titilebar=no,resizable=no,");

比我尝试的东西...

var w = novoForm.innerWidth;
var h = novoForm.innerHeight;
novoForm.document.getElementById("monitor").innerHTML = 'Janela: '+w+' x '+h;

我这样做是为了查看对象“novoForm”是否有效。但是“监视器”div中没有​​写任何内容。我也尝试使用 onload 事件但没有成功。我想知道这是一些安全限制还是我错过了什么......

4

3 回答 3

11

您做得对，但您确实需要确保使用onload（或轮询），因为页面需要一段时间才能加载到新窗口中。

这是一个完整的工作示例：Live Copy | 来源

(function() {

  document.getElementById("theButton").onclick = function() {

    var novoForm = window.open("http://jsbin.com/ugucot/1", "wFormx", "width=800,height=600,location=no,menubar=no,status=no,titilebar=no,resizable=no,");
    novoForm.onload = function() {
      var w = novoForm.innerWidth;
      var h = novoForm.innerHeight;
      novoForm.document.getElementById("monitor").innerHTML = 'Janela: '+w+' x '+h;
    };
  };
})();

我想知道这是一些安全限制还是我错过了什么......

不在您的示例中，不，因为页面显然是从同一来源加载的。如果 URL 来自不同的来源，那么是的，您会遇到Same Origin Policy，它禁止跨域脚本。您可以通过document.domain属性放宽它，将包含上述代码的窗口和正在加载的窗口设置document.domain为相同的值。从上面的链接：

如果两个窗口（或框架）包含将域设置为相同值的脚本，则这两个窗口的同源策略会放宽，并且每个窗口都可以相互交互。例如，从 orders.example.com 和 catalog.example.com 加载的文档中的协作脚本可能会将它们的 document.domain 属性设置为“example.com”，从而使文档看起来具有相同的来源并使每个文档都可以读取对方的属性。

更多关于document.domain可以在 MDN上找到。请注意，它仅适用于两个文档共享一个公共父域的情况，例如，如果它们都设置为，则它适用于app1.example.comand ，但不适用于and因为它们没有可以设置的共同值。app2.example.comexample.comexample1.comexample2.com

于 2013-04-08T13:37:57.273 回答
1

或者，这是一个解决方案：

var novoForm = window.open("somform.html", "wFormx", "width=800,height=600,location=no,menubar=no,status=no,titilebar=no,resizable=no,");
var teste = function(){
    var mon = novoForm.document.getElementById("monitor");
    if(typeof(mon)!="undefined"){
        //novoForm.alert("Achei!");
        var h = novoForm.innerHeight;
        var strh = String(h - 40 - 30)+'px';
        novoForm.document.getElementById("pagina").style.height = strh;
        novoForm.document.getElementById("monitor").innerHTML = '<p class="legenda">&copy; NetArts | gustavopi</p>';
        clearInterval(id);
    }
}
var id = setInterval(teste, 100);

这将完成这项工作。对我来说不是一个“漂亮”的解决方案，但它有效！

于 2013-04-08T18:35:49.207 回答
-1

取决于您尝试加载到新窗口中的 url。@TJ 是对的。另请注意，如果您只想加载一个空白文档，您可以将“about:blank”加载到 url 中。唯一的区别是您将使用 outerWidth ，因为您尚未加载实际文档。

var novoForm = window.open("about:blank", "wFormx", "width=800,height=600,location=no,menubar=no,status=no,titilebar=no,resizable=no,");
var w = novoForm.outerWidth;
var h = novoForm.outerHeight;
novoForm.document.body.innerHTML = 'Janela: '+w+' x '+h;
于 2013-04-08T13:51:52.170 回答