Javascript addEventListener:事件未添加到特定位置(向下键)
我在文档中添加了两个事件侦听器,虽然其中一个在另一个之后放置时不起作用,但在另一个之前放置时效果很好,我不知道为什么? 指定代码:Javascript addEventListener:事件未添加到特定位置(向下键),javascript,event-listener,Javascript,Event Listener,我在文档中添加了两个事件侦听器,虽然其中一个在另一个之后放置时不起作用,但在另一个之前放置时效果很好,我不知道为什么? 指定代码: document.addEventListener("keydown", function() { alert("key was pressed!"); }); 当它放置在click事件侦听器上方时,工作正常,问题是当它放置在它之后时,只有click起作用,而不是keydown 我的代码: var buttonLength = document.querySe
document.addEventListener("keydown", function() {
alert("key was pressed!");
});
当它放置在click事件侦听器上方时,工作正常,问题是当它放置在它之后时,只有click起作用,而不是keydown
我的代码:
var buttonLength = document.querySelectorAll(".drum").length;
document.addEventListener("keydown", function() {
alert("key was pressed!");
}); //Works here
for (i = 0; i <= buttonLength; i++) {
document.querySelectorAll(".drum")[i].addEventListener("click", function() {
var buttonInnerHTML = this.innerHTML;
switch (buttonInnerHTML) {
case "w":
var tom1 = new Audio('sounds/tom-1.mp3');
tom1.play();
break;
case "a":
var tom2 = new Audio('sounds/tom-2.mp3');
tom2.play();
break;
case "s":
var tom3 = new Audio('sounds/tom-3.mp3');
tom3.play();
break;
case "d":
var tom4 = new Audio('sounds/tom-4.mp3');
tom4.play();
break;
case "j":
var snare = new Audio('sounds/snare.mp3');
snare.play();
break;
case "k":
var crash = new Audio('sounds/crash.mp3');
crash.play();
break;
case "l":
var kick = new Audio('sounds/kick-bass.mp3');
kick.play();
break;
default:
console.log(buttonInnerHTML);
}
});
}
document.addEventListener("keydown", function() {
alert("key was pressed!");
}); //Doesn't work here
你的问题在循环中。 迭代次数过多,请更改为:
for (i = 0; i < buttonLength; i++) //(remove equal sign)
您的代码抛出错误,因此引擎无法继续执行下一个按键事件您正在执行相同的事件。Read它不起作用,因为控制台中将出现TypeError。数组是基于零的,因此最后一个元素位于index Array.length-1,但您的循环也尝试访问index Array.length处的元素