Question

所以我有一个模式，在单击关闭按钮时似乎不想关闭。这就是我当前的代码看起来像显示和关闭模态以及将模态背景添加到DOM并删除它。

const $ = document;

class Selectable {

    addElement = () => {
        const html = '<div class="modal-backdrop show"></div>';
        const body = $.querySelector('body');

        body.innerHTML += html;
    };

    removeElement = elementClass => {
        let element = $.querySelector('.' + elementClass);
        element.parentNode.removeChild(element);
    };

    showModal = () => {
        const modal = $.getElementById('modal-finish');
        const body = $.querySelector('body');

        modal.classList.add('show');
        body.classList.add('modal-open');

        this.addElement();
    };

    closeModal = () => {
        const modal = $.getElementById('modal-finish');
        const body = $.querySelector('body');

        modal.classList.remove('show');
        body.classList.remove('modal-open');

        this.removeElement('modal-backdrop');
    };

    init() {
        // Look Up Button
        $.getElementById('btn-look-up').addEventListener(
            'click',
            this.showModal,
            false
        );

        // Close the Modal
        $.querySelector('.modal-close').addEventListener(
            'click',
            this.closeModal,
            false
        );
    }
}

const Selectables = new Selectable();
Selectables.init();

我有一种感觉，因为clickEvent正在直接注册或者其他什么，但我不完全确定。

基本上模态打开但关闭按钮根本不起作用。

我之前只使用过jQuery来做JavaScript，所以我使用const $ = document;来简化对标准JavaScript的更改。

Answer 1

尝试以下代码：试试吧

document.getElementById（＆＃34; myBtn＆＃34;）。addEventListener（＆＃34; click＆＃34;，function（）{document.getElementById（＆＃34; demo＆＃34;）。innerHTML =＆＃34; Hello世界＆＃34 ;; }）;

addEventListener（'click'）不用于关闭模式的按钮

1 个答案: