window.opener 不同的按钮和输入类型=按钮

Question

敬礼。我已经用 Firefox 证明了一个 IE。

如果您从按钮调用 paginaH1.html（函数 openSon）（window.opener 无效）。

如果您通过输入类型=按钮工作调用。

如果单击按钮不起作用(a0-ObjectWindow,a1-Undefined)。

如果你点击输入类型='button' work(a0-ObjectWindow,a1-ObjectHTMLElement).

这是页面开启工具：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>prueba-Father</title>
 <script type="text/javascript">

 function openSon() {
 window.datoPField = document.frmName.campoPadre;
 alert(window.datoPField+' ahora abro hijo');
 a=window.open('paginaH1.html');
 }

 </script>
 </head>
 <body>
 <form  name="frmName">
 <h1 id="text">Comunicacion entre dos paginas con Javascript.</h1>
 <input type="text" name="campoPadre" id="campoPadre" value="delPadre"  >
 <input type="button" onClick="openSon()" value="input-button">
 <button              onClick="openSon()">button</button>
 <button              onClick="window.datoPField = document.getElementById('campoPadre'); a=window.open('paginaH1.html');">bt+getElement</button>
</form>
 </body>
</html>

现在pagninaH1.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>Son page</title>

 <script type="text/javascript">
 function iniciar() {
 alert(0);
 alert("a0-"+window.opener);
 alert("a1-"+window.opener.datoPField);
 alert("b0-"+window.opener.frmName.campoPadre);
 alert("c0-"+window.opener.datoPField.value);
 this.datoField   = opener.datoPField;
 alert("d0-"+this.datoField);
 }

 </script>

 </head>
 <body ONLOAD="iniciar()">
 <h1 id="text">esta es la pagina hijo </h1>
 <button onclick="this.window.close();">Cerrar</button>
 </body>
</html>

谢谢。

Answer 1

button 个元素的 default type 是 submit。即 <button>x</button> 与 <button type="submit">x</button> 完全相同。当您在 form 中有一个 button（您这样做）时，单击它会在运行它的单击处理程序之后提交表单。 form 没有 action 的元素默认提交到页面的 URL，这会破坏当前页面并用新副本替换它（很容易错过）。

因此，当您单击 input 时，它会运行其单击处理程序，启动打开弹出窗口的过程，并且不会执行任何其他操作。初始页面的原始 window、文档和元素仍然存在。 child window 可以访问那些元素。

但是当您单击 button 时，它会运行其单击处理程序，启动打开弹出窗口的过程，然后提交表单，销毁 window、文档和元素。 child window 无法访问元素，它们不再存在。（相反，存在 new 元素，但 child 无法访问它们。）

如果您希望 button 的行为方式与 input 的行为方式相同，请向其添加 type="button"。（是的，说 <button type="button" ...> 确实看起来很荒谬。:-) )

window.opener 不同的按钮和输入类型=按钮

window.opener difrents button and input type=button

javascript

window.opener