JavaScript удалитьEventListener проблемы - PullRequest
Новая
       20

JavaScript удалитьEventListener проблемы

0 голосов
/ 22 января 2019

Итак, я пытаюсь использовать функцию removeEventListener в JS.Я новичок в JavaScript, и я не слишком много с ним работал, так что для меня это практически неизведанная территория.Я понимаю, что не могу использовать встроенный код в части кода addEventListener, и именно здесь у меня начинаются всевозможные проблемы.Мой текущий код выглядит следующим образом: 

 if (document.getElementById('breadBox') === null && boxShowing === false) {
        headEl.appendChild(breadBoxEl);
        headEl.appendChild(breadBoxTextEl);
        boxShowing = true;
        if (breadBoxEl !== null) {
            console.log("The breadbox exists!");
            window.addEventListener("keydown", function (e) {
                if (e.keyCode === 81 || e.keyCode === 27) {
                    removeBreadSign();
                }
                if (boxShowing === false) {
                    console.log("Nothing to add");
                } else {
                    if (e.keyCode === 69 || e.keyCode === 32) {
                        basket.push(breadData[0].p_id);
                        alert("You have added 1 bread to your basket.");
                        console.log(basket.length);
                    }
                }
                e.preventDefault();
            });
        }
    } else {
        console.log('BreadBox already exists. NOT spawning another.');
    }
});

Я пытаюсь добавить что-то в свою корзину и не хочу, чтобы кнопки регистрировались, если мой breadBoxEl фактически не отображается.Проблема этой текущей реализации в том, что она каким-то образом сохраняет то, что было в событии.Так что, если я сначала сделаю это с хлебом, это будет отлично работать.И я могу закрыть окно, и оно не будет регистрировать мои нажатия клавиш.Однако, если я затем открою другую коробку из другого магазина, например, апельсинов, он сначала выдаст предупреждение о хлебе, И добавит его в корзину, а затем отобразит предупреждение об апельсинах и добавит его в корзину.И так далее, и так далее ...

Функция removeBreadSign выглядит следующим образом: 

function removeBreadSign() {
if ((document.getElementById("breadBox") && document.getElementById("breadText")) !== null) {
    var text = document.getElementById("breadText");
    var box = document.getElementById("breadBox");
    text.parentNode.removeChild(text);
    box.parentNode.removeChild(box);
    boxShowing = false;
}

}

Первое, что я попробовал, было создатьвнешняя функция выглядит следующим образом: window.addEventListener("keydown", buttonFunction(event, "b"));

И затем есть соответствующая функция: 

function buttonFunction(e, grocery) {
e = e || window.event;
if (grocery === "b") {
    if (e.keyCode === 81 || e.keyCode === 27) {
        removeBreadSign();
        }
    }
    e.preventDefault();
}

Однако при этом событие не проходит должным образом, а окно незарегистрировать мои нажатия клавиш.Второй параметр, который я передаю, «b», потому что мне нужно добавить это к 4 различным продуктам, поэтому я должен иметь возможность определить, какой из них активен.

Может кто-нибудь дать подсказку, что я здесь не так делаю.Может быть, я должен упомянуть, что это происходит в A-Frame, но так как это чисто проблема с JavaScript, я не видел в этом необходимости.

Если ничего не имеет смысла, скажите мне, и я постараюсь уточнить.

...