為什么事件“淡入淡出”在 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 鏈接。

提琴手

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/