如何按顺序关闭最后打开的弹出窗口?



如何按顺序关闭最后打开的弹出窗口?

下面的图片是一个图像,每当弹出窗口打开时,弹出标签就堆叠在一起。
输入图片描述

下面是应用的源代码。

/* ESC popup close start */
$(document).on('keyup', function(e) {
  if (e.key == "Escape") $('.window .close').last().click();
});
/* ESC popup close end */
  • 确保close点击事件先于点击触发
  • 你需要addClass到最后一个.window元素,以避免它,当你再次订购最后一个项目

$(".close").on("click" , function(){
  $(this).closest(".window").hide();
});

/* ESC popup close start */
$(document).on('keyup', function(e) {
  if (e.key == "Escape") $('.window:not(.hidden)').last().addClass("hidden").find(".close").click();
});
/* ESC popup close end */
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="window">Window 1<div class="close">X</div></div>
<div class="window">Window 2<div class="close">X</div></div>
<div class="window">Window 3<div class="close">X</div></div>

只需将弹出窗口设置为任意变量,然后使用window.close关闭该变量

const daddyWindow = window.open("", "window" + number, "width=200,height=100");
daddyWindow.document.write('window Popup code');
daddyWindow.close();

试试这个:

<html>
<header>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
        let openedWindows = [];
        let newWindow;
        let number = 0;
        function openWindow() {
            number++;
            newWindow = window.open("", "window" + number, "width=200,height=100");
            newWindow.document.write(`<a href="javascript:window.close();"class="video-close">Close this window ${number}</a>`);
            openedWindows.push(newWindow);
        }
        $(document).on('keyup', function (e) {
            if (e.key == "Escape") {
                if (openedWindows && openedWindows.length >= 0 && openedWindows[openedWindows.length - 1]) {
                    openedWindows[openedWindows.length - 1].close();
                    openedWindows.pop()
                }
            }
        });
    </script>
</header>
<body>
    <h3 style="color:brown"> Close Window Example </h3>
    <button onclick="openWindow()">Open New Window</button>
</body>
</html>

最新更新