jQuery 在外部单击时模态框不会关闭

Question

我正在使用这个 jQuery 模态 here 但是外部 div 的 onclick 事件没有触发。

这意味着如果在其外部按下，模态框不会关闭。

我尝试过设置超时并在点击事件时分离叠加层，但没有成功。

  $(".js-modal-close").on("click", function() {
        $("#WidgetContainer").toggle("slow");
        $(".modal-box, .modal-overlay").fadeOut(500, function() {
            $(".modal-overlay").remove();
        });
    });
setTimeout(() => {

    $(".modal-overlay").on("click", function() {
        $("#WidgetContainer").toggle("slow");
        $(".modal-box, .modal-overlay").fadeOut(500, function() {
            $(".modal-overlay").remove();
        });
    });
}, 500);

Answer 1

摆脱你的超时。它不起作用的原因是 class modal-overlay 的元素不在 DOM 中。

您可以使用事件委托。 $(document).on("click", ".modal-overlay", function() { ... });

jQuery 在外部单击时模态框不会关闭

jQuery modal doesn't close when clicking outside

javascript

jquery

simplemodal