[英]Double event on firefox on keydown event
I don't understand why with Firefox when I launch keydown event with space my click event is also launched. 我不明白为什么在启动具有空格的keydown事件时也会启动click事件的Firefox。
With enter no problem. 随着输入没有问题。
var eventFunction = function(e) {
if (content.style.display === 'none' || content.style.display === '') {
content.style.display = 'block';
} else {
content.style.display = 'none';
}
}
button.addEventListener('click', function(e){
console.log('click');
eventFunction(e);
this.removeEventListener('click', eventFunction, false);
}, false);
button.addEventListener('keydown', function(e) {
console.log('keydown');
if(e.keyCode === 13 || e.keyCode === 32) {
eventFunction(e);
e.stopPropagation();
e.preventDefault();
this.removeEventListener('keydown', eventFunction, false);
}
}, false);
Demo here : https://jsfiddle.net/korigan/f371vcxx/ 演示在这里: https : //jsfiddle.net/korigan/f371vcxx/
In Firefox, the click event is fired when you release the key. 在Firefox中,释放键时会触发click事件。 Listen for keyup
to call preventDefault()
on the second event: 侦听keyup
以在第二个事件上调用preventDefault()
:
var button = document.querySelector('button'); button.addEventListener('click', function () { console.log('clicked'); }); button.addEventListener('keydown', function (e) { if (e.key === ' ' || e.key === 'Enter') { e.preventDefault(); console.log('Space or Enter'); } }); button.addEventListener('keyup', function (e) { if (e.key === ' ' || e.key === 'Enter') { e.preventDefault(); } });
<button>Press me</button>
e.stopPropagation();
does that you need. 您需要吗? No click firing on key press. 按键时无点击触发。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.