`window.open` 函数不会打开弹出窗口，但会使现有的 html 和其他代码消失

Question

我有一个非常简单的代码，它试图打开一个弹出窗口 window 但它会破坏整个 html 和其他代码。

代码如下：

<head>
<script type="text/javascript">
    function write(){
/*  var w = String(window.offsetWidth),
        s = String(window.offsetHeight);*/

    var s = window.open('', 'MsgWindow', '_blank');
};
</script>
</head>
<body>
<button onclick="write();" id="writeBtn">Write</button>
</body>

如此简单，但它什么都不做！

不知道是什么问题

注意事项...

点击按钮后屏幕变白，所有元素消失
当我在 google 控制台中看到这个时，令我震惊的是所有 html 代码都消失了
我什至尝试像 s.document.write('sanmveg') 那样写入变量 s 但那没有用

有什么问题？

Answer 1

重命名您的函数。 document.write() 被调用而不是您的函数。调用不带参数的 document.write() 会导致像这样的意外行为。

function mywrite() {
  var s = window.open('', 'MsgWindow');
};

<button onclick="mywrite();" id="writeBtn">Write</button>

Answer 2

我想您应该按正确的顺序填写参数，即：

window.open( "URL" , "window name" , "menubar,resizable,width,height,top,left") ;

请注意，第三个参数应该是一个逗号分隔的字符串，用于指定一些属性

Answer 3

问题是您的 write 函数没有被调用；相反，正在调用 document.write。这样做的原因有点复杂，但简短的版本是：如果你调用你的函数，而不是 document（或 button 元素），比如 openwindow，它'会工作的。

那么为什么 document.write 被调用，即使你正在调用 write()，期望它接收你的全局 write 函数？

基于属性的 onxyz 事件处理程序在一个复杂的范围内被调用，它实际上是一系列嵌套的 with 语句，每个语句混合不同的东西，其中一个是文档对象。

当您在代码中对 button 使用基于属性的 onxyz 事件处理程序时，浏览器会为您生成一个看起来 非常粗略的处理程序 像这样：

with (document) {
    with (theButton) {
        handler = function() {
            /* This is your attribute text */
            write();
            /* This is the end of your attribute text */
        };
    }
}

...然后调用 handler 函数。因此，当浏览器调用您的函数时，它会尝试首先针对按钮元素解析您函数中的任何自由符号，例如 write，然后如果按钮没有 write，它会尝试 document，然后如果 document 没有，它会尝试全局范围。

当然，document 有一个 write 函数，所以它被调用而不是你的事件处理程序。

您实际上可以在 Chrome 或带有 Firebug 的 Firefox 中看到这个：

在onclick中创建一个带有debugger;的按钮，例如：
```
<button onclick="debugger;">Click Me</button>
```
在浏览器中打开页面
打开你的开发工具/Firebug
点击按钮

此时会弹出调试器，停在debugger;语句上。这是您在 Chrome 中看到的内容：

（我不知道 Chrome 在文档和按钮之间插入的对象是什么；它将是 Chrome 特定的实现细节。）

在 Firefox+Firebug 中：

您可以看到该函数是如何嵌套在几个 with 块中的。

如果你的 button 在 form 里面，那么 form 也会在那里，像这样：

with (document) {
    with (theForm) {
        with (theButton) {
            handler = function() {
                /* This is your attribute text */
                write();
                /* This is the end of your attribute text */
            };
        }
    }
}

...因此自由符号将尝试针对表单元素进行解析。

`window.open` 函数不会打开弹出窗口，但会使现有的 html 和其他代码消失

`window.open` function dosen't open a popup windo but do vanish the existing html and other code

javascript

html

window.open

注意事项...