Question

因此，我正在尝试利用JS中的removeEventListener函数。我是一个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问题，因此我认为没有必要。

如果没有任何意义，请告诉我，我会尽力澄清。

JavaScript removeEventListener问题

0 个答案: