Question

我试图在新窗口中打开图像，但是当我多次单击链接时，新窗口的大小与我将其调整为的大小不一致。为什么第二次单击锚标记时，窗口没有打开为我指定的大小？（我第一次点击定位标记时，它会以我期望的大小打开）

JS

<script>
    function openW(a) {
        var i = new Image();
        i.src = "somepic.png";

        // open up a new blank
        var w = window.open("", "", "scrollbars=yes");

        w.resizeTo(i.width, i.height/2);
        w.document.write('<img src="' + i.src + '">');
        return false;
    }
</script>

HTML：

<div class="container">
    <a target="_blank" onclick="openW('e')">
        <img src="somepic.png" alt="some pic">
    </a>
</div>

Answer 1

尝试在window.open调用中设置窗口大小。像这样：

window.open(myFancyURL, "_blank", 'width=100, height=100')

将打开一个新的窗口，该窗口宽100像素，高100像素。有关更多功能，请参见Mozilla文档window.open：https://developer.mozilla.org/en-US/docs/Web/API/Window/open

Answer 2

使用以下代码，您可以管理尺寸窗口：

<script>
    function openW(a) {
        var i = new Image();
        i.src = "somepic.png";

        // open up a new blank
        var w = window.open("", "test", "resizable,height=260,width=370");

        w.document.write('<img src="' + i.src + '">');
        return false;
    }
</script>

Answer 3

您可能正在寻找类似的东西

注意：不会弹出堆栈片段

window.addEventListener("load", () => {
  document.querySelector(".container").addEventListener("click", (e) => {
    if (e.target.tagName.toUpperCase() === "IMG") {
      const img = e.target;
      const w = img.width;
      const h = img.height;
      // open up a new blank
      let win = window.open("", "img", "scrollbars,width=" + (w + 10) + ",height=" + (h + 10));
      if (win) {
        e.preventDefault(); // allow the target
        win.document.write('<img src="' + img.src + '">');
        win.document.close(); // important
      }
    }
  })
})

<div class="container">
  <a href="" target="_blank">
    <img src="https://via.placeholder.com/300/09f/fff.png" alt="some pic" />
  </a>
</div>

在第二次单击时window.open（）未打开正确的窗口大小

3 个答案: