javascript - 为什么事件'fadein'在JS中运行两次？

Question

当我按 esc 键或任何其他键使弹出窗口消失时没有问题（例如 event.keycode == 37 or else）。但是，我按下回车键，弹出窗口消失，弹出窗口再次弹出。问题是什么？

    $(related-popup-open-button-id).on('click', fadeIn);

    functionfadeIn () {
        $(related-popup-id).fadeIn(1000);
    };

    $(related-popup-close-button-id).on('click', fadeOut);

    function fadeOut () {
        $(related-popup-id).fadeOut(1000);
    };

    $(document).on('keydown', push);

    function push(event) {
        if(event.keycode == 13) {
            $(related-popup-id).fadeOut(1000);
        }
    };

---

对不起，我在下面添加了 jsfiddle 链接。

jsfiddle

Answer 1

只需在打开弹出窗口时更改焦点。

$('#popup-open-btn').on('click', fadeShow);

function fadeShow () {

    $('#popup').fadeIn(500);
    $("#popup-close-btn").focus();
};

$('#popup-close-btn').on('click', fadeClose);

function fadeClose () {
    $('#popup').fadeOut(500);
};

$(document).on('keydown', push);

function push(event) {
    if(event.which === 13) {
        $('#popup').fadeOut(500);
    }
};

https://jsfiddle.net/b8yhtkxz/