代码之家 › 专栏 › 技术社区 › xero

如何将此延迟添加到模式打开脚本中?

css html javascript

-1

xero · 技术社区 · 10 月前

我有一个id=“myBtn”的模态脚本

`    <script>
        var datamap = new Map([
            [document.getElementById("myBtn"), document.getElementById("myModal")],
            [document.getElementById("myBtn1"), document.getElementById("myModal1")],
            [document.getElementById("myBtn2"), document.getElementById("myModal2")]
        ]);

        datamap.forEach((value, key) => {
            doModal(key, value);
        });

        function doModal(anchor, popupbox) {

            // Get the <span> element that closes the modal
            var span = popupbox.getElementsByClassName("close")[0];

            anchor.addEventListener("click", function (event) {
                popupbox.style.display = "block";
            });

            span.addEventListener("click", function (event) {
                popupbox.style.display = "none";
            });

            window.addEventListener("click", function (event) {
                if (event.target == popupbox) {
                    popupbox.style.display = "none";
                }
            });
        }
    </script>`

我该如何将我在这个网站上找到的下面的脚本添加到上面的脚本中呢。


`setTimeout(function() {
    $('#myModal').modal();
}, 2000);`

我正在尝试制作一个3秒的假加载程序,但我不知道如何将其添加到上面的代码中。我是新手。有人可以编辑或添加这个吗?提前谢谢

1 回复 | 直到 10 月前

Unmitigated 10 月前

您可以使用添加延迟 setTimeout 在将显示设置为之前 block 。

anchor.addEventListener("click", function (event) {
    // show the modal after 2 seconds
    setTimeout(() => popupbox.style.display = "block", 2000);
});

推荐文章

Softly · 单选按钮未按预期取值

11 月前

Jason Owens · 我的html/javascript播放按钮无法播放嵌入的youtube视频

11 月前