Question

我有一个HTML页面，我可以从中启动一个弹出窗口。在弹出窗口中，我想处理选项，例如在按下取消按钮时关闭弹出窗口，但浏览器无法找到我在内部定义的Javascript函数弹出窗口（ReferenceError: dismissPopup is not defined）：

＆＃13;

<html>
    <head>
    <script type="application/javascript">
    <!-- hide script from browser
    /* <![CDATA[ */
    function launch() {
      win = window.open("", "popup", "toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,resizable=yes,width=1400,height=550");

      if (!win) {
        alert("Unable to create pop-up window.  Are you using a pop-up blocker?");
        return;
      }

      html = "";
      html += "<html>\n";
      html += "<head>\n";
      html += "<script type=\"text/javascript\">\n";
      html += "  function dismissPopup() {\n";
      html += "    close();\n";
      html += "  }\n";
      html += "</script>\n";
      html += "</head>\n";
      html += "<body>\n";
      html += "<title>click me</title>\n";
      html += "<table class=\"buttons\">\n";
      html += "<tr>\n";
      html += "<td><button size=\"250\">Save</button\"/></td>\n";
      html += "<td><button size=\"250\" onclick=\"dismissPopup(); return false;\">Cancel</button></td>\n";
      html += "</tr>\n";
      html += "</table>\n";
      html += "</body>\n";
      html += "</html>";

      win.document.body.innerHTML = html;
    }
    /* ]]> */
    // end hiding -->
    </script>
    </head>
    <body>
    <p>
    <button onclick="launch()">Launch</button>
    </p>
    </body>
</html>

＆＃13;

使用 innerHTML 来指定Javascript似乎很尴尬，但是当我以这种方式构建弹出窗口时，我不知道如何指定它。 <script>部分甚至出现在Firebug Inspector内部的正文部分！这看起来很奇怪，但GUI渲染看起来还不错。

我做错了什么？任何人都可以建议一种方法来解决这个问题吗？

根据Xufox的Script tag in Javascript string问题和建议，我试图保护</script>，甚至为隐藏浏览器中的脚本添加了魔力，但功能仍然是找不到：

<html>
<head>
<script type="application/javascript">
<!-- hide script from browser
/* <![CDATA[ */
function launch() {
  win = window.open("", "popup", "toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,resizable=yes,width=1400,height=550");

  if (!win) {
    alert("Unable to create pop-up window.  Are you using a pop-up blocker?");
    return;
  }

  html = "";
  html += "<html>\n";
  html += "<head>\n";
  html += "<script type=\"text/javascript\">\n";
  html += "<" + "!" + "-" + "-" + " " + "h" + "i" + "d" + "e" + " " + "s" + "c" + "r" + "i" + "p" + "t" + " " + "f" + "r" + "o" + "m" + " " + "b" + "r" + "o" + "w" + "s" + "e" + "r" + "\n";
  html += "/" + "*" + " " + "<" + "!" + "[" + "C" + "D" + "A" + "T" + "A" + "[" + " " + "*" + "/" + "\n";
  html += "  function dismissPopup() {\n";
  html += "    close();\n";
  html += "  }\n";
  html += "/" + "*" + " " + "]" + "]" + ">" + " " + "*" + "/" + "\n";
  html += "/" + "/" + " " + "e" + "n" + "d" + " " + "h" + "i" + "d" + "i" + "n" + "g" + " " + "-" + "-" + ">" + "\n";
  html += "<\/script>\n";
  // html += "</" + "script>\n";
  html += "</head>\n";
  html += "<body>\n";
  html += "<title>click me</title>\n";
  html += "<table class=\"buttons\">\n";
  html += "<tr>\n";
  html += "<td><button size=\"250\">Save</button\"/></td>\n";
  html += "<td><button size=\"250\" onclick=\"dismissPopup(); return false;\">Cancel</button></td>\n";
  html += "</tr>\n";
  html += "</table>\n";
  html += "</body>\n";
  html += "</html>";

  alert(JSON.stringify(html));

  win.document.body.innerHTML = html;
}
/* ]]> */
// end hiding -->
</script>
</head>
<body>
<p>
<button onclick="launch()">Launch</button>
</p>
</body>
</html>

我通过将我的Javascript转移到父级并让孩子引用父级函数来完成工作：

<html>
<head>
<script type="application/javascript">
let popup = null;

function launch() {
  popup = window.open("", "popup", "toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,resizable=yes,width=1400,height=550");

  if (!popup) {
    alert("Unable to create pop-up window.  Are you using a pop-up blocker?");
    return;
  }

  html = "";
  html += "<html>\n";
  html += "<body onload=\"alert('welcome, weary browser');\">\n";
  html += "<title>click me</title>\n";
  html += "<table class=\"buttons\">\n";
  html += "<tr>\n";
  html += "<td><button size=\"250\">Save</button\"/></td>\n";
  html += "<td><button size=\"250\" onclick=\"window.opener.dismissPopup(); return false;\">Cancel</button></td>\n";
  html += "</tr>\n";
  html += "</table>\n";
  html += "</body>\n";
  html += "</html>";

  popup.document.body.innerHTML = html;
}

window.dismissPopup = function() {
  if (popup) {
    popup.close();
    popup = null;
  }
  else {
    alert("No popup to close!");
  }
}
</script>
</head>
<body>
<p>
<button onclick="launch()">Launch</button>
</p>
</body>
</html>

在弹出窗口中使用javascript

0 个答案: