在window.open（）生成的窗口中执行JavaScript_Javascript_Window.open

在window.open（）生成的窗口中执行JavaScript

javascript

在window.open（）生成的窗口中执行JavaScript,javascript,window.open,Javascript,Window.open,我的问题似乎如下：我有以下代码： function openNew(theImage){ var theHTML = "<!doctype html><html><head><script src='../js/windowScript.js'></script><title>EditWindow</title></head><body><div id='canvasCo

我的问题似乎如下：

我有以下代码：

function openNew(theImage){

    var theHTML = "<!doctype html><html><head><script src='../js/windowScript.js'></script><title>EditWindow</title></head><body><div id='canvasContainer'></div><img id='removeable' src='"+theImage+"'><button id='cropMe'>Crop it!</button></body></html>";
    var editWindow = window.open("","","width=1000 height=800 titlebar=0");


    editWindow.document.write(theHTML);
}

但是这个脚本永远不会执行。如果我通过chrome的inspector检查脚本，它会告诉我它在那里，它甚至会检测脚本中是否有错误，但它不会得到执行

是否有一种解决方法可以让脚本在新窗口中运行，而无需通过

editWindow.document.write（）注入脚本
?
提前感谢您的支持
 再次更新了，并实际测试了代码
windowScript.js
function removeImg(myWindow){
    var imgTAG = myWindow.document.getElementById("removeable");
    var imgURL = imgTAG.getAttribute("src");
    if(imgTAG.parentNode) {
        imgTAG.parentNode.removeChild(imgTAG);
        console.log(imgURL);
    }
    else {
        console.log("fail");
    }
}

function openNew(theImage){

    var theHTML = "<!doctype html><html>" +
                  "<head><title>EditWindow</title></head><body>" +
                  "<div id='canvasContainer'></div><img id='removeable' src='"+theImage+"'>" +
                  "<button id='cropMe'>Crop it!</button></body></html>";

    var editWindow = window.open("","","width=1000 height=800 titlebar=0");

    editWindow.document.write(theHTML);
    editWindow.document.getElementById("cropMe").addEventListener("click",function(){ removeImg(editWindow); });
}

函数删除（myWindow）{
var imgTAG=myWindow.document.getElementById（“removeable”）；
var imgURL=imgTAG.getAttribute（“src”）；
if（imgTAG.parentNode）{
imgTAG.parentNode.removeChild（imgTAG）；
console.log（imgURL）；
}
否则{
控制台日志（“失败”）；
}
}
函数openNew（图像）{
var theHTML=“”+
“编辑窗口”+
"" +
“收起它！”；
var editWindow=window.open（“，”，“宽度=1000高度=800标题栏=0”）；
editWindow.document.write（HTML）；
editWindow.document.getElementById（“cropMe”）.addEventListener（“单击”，函数（）{removeImg（editWindow）；}）；
}

windowtest.html
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>WindowTest</title>

    <script src="windowScript.js"></script>

</head>
<body>

<a href="javascript:openNew('Capture.PNG')">open window</a>

</body>
</html>


窗口测试
您需要调用editWindow.document.close（）
 如果它检测到有错误，它将运行脚本。您是否尝试过向其添加显式console.log（）调用？哇，这很棘手。即使将HTML字符串转换为数据url并使用该url打开页面也不起作用！它源于head，但脚本文件具有自执行功能。如果它在head，它将如何找到元素？我明白你的意思。脚本将在加载元素之前执行，但找不到元素。似乎更可能的是，原始代码中的问题是，它在加载页面后编写html，因此脚本中的window.onload事件永远不会被触发。我会更新我的答案。谢谢不幸的是，您提供的代码留给我一个“未捕获的引用错误：未定义removeImg”。但至少我现在知道，我的代码没有执行，因为从未调用window.onload。请参阅我更新的答案。测试和工作。代码通常存在一些问题，但这里的方法是在主文档上的单个脚本中获取函数的源代码，并在删除图像的函数中引用新窗口。
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>WindowTest</title>

    <script src="windowScript.js"></script>

</head>
<body>

<a href="javascript:openNew('Capture.PNG')">open window</a>

</body>
</html>