Construyo un juego web en mi tiempo libre y la gente ha estado usando clickers automáticos para hacer cosas que no pretendo.
Este es un ejemplo extremadamente simplificado:
button1.onclick = handleButton1Click button2.onclick = handleButton2ClickLo que quiero es evitar clics no confiables y realmente ESPERABA que este método hubiera funcionado:
button1.onclick = handleButton1Click button2.onclick = handleButton2Click window.onclick = e => { if (!e.isTrusted) { e.stopPropagation() return false } }Pero esto no hace lo que estoy buscando, por lo que asumo es porque son eventos separados.
¿Hay algo que pueda hacer además de verificar isTrusted en cada evento de clic?
Puede seguir el enfoque que tenía, pero en lugar de escuchar globalmente, puede envolver sus llamadas para que pueda verificar el clic real.
const button1 = document.querySelector('#button1'); const button2 = document.querySelector('#button2'); const handleButton1Click = (evt) => { console.log("1", evt.target); evt.currentTarget.classList.toggle('active'); } const handleButton2Click = (evt) => { console.log("2", evt.target); evt.currentTarget.classList.toggle('active'); } const clean = (fnc) => (e) => { if (!e.isTrusted) { console.log('blocked'); e.stopPropagation() return false } return fnc(e); } button1.onclick = clean(handleButton1Click); button2.onclick = clean(handleButton2Click); button1.click(); button1.click(); button2.click() .active { color: yellow; background-color: lime; } <button id='button1'>button1</button> <button id='button2'>button2</button>Aquí también puede acelerar las llamadas para que un usuario no pueda hacer clic en ellas más de una vez cada X milisegundos.