Deseo agregar código a un evento de clic en un archivo y una etiqueta de secuencia de comandos. Pero parecen estar en conflicto. ¿Cómo puedo conseguir esto?
JavaScript:
window.onload = function() { document.getElementById("button3").addEventListener("click", respond3); } function respond3(e) { alert("Way to go!!"); }html:
<head> <title>Second Javascript</title> <script src="Second.js"></script> <script> window.onload = function() { document.getElementById("button2").addEventListener("click", respond); } function respond(e) { alert("getting better"); } </script> </head> <body> <h1>The quick brown fox jumps over the lazy dogs</h1> <button onclick='alert("bad practice");'>Inline</button> <button id='button2'>Script tag</button> <button id='button3'>Separate file</button> </body>Por sugerencia de Quentin, cambié la etiqueta del script a esto:
<script> window.addEventListener('load', AddClick2) function AddClick2() { document.getElementById("button2").addEventListener("click", respond); } function respond(e) { alert("getting better"); } </script>Las propiedades on* solo pueden tener asignada una función. No es tanto un conflicto, ya que simplemente está sobrescribiendo la primera función de onload con la segunda.
Si bien podría hacer algo como verificar si ya hay una función allí, luego copiarla en una nueva variable, luego llamarla desde la nueva variable dentro de su nueva función de carga … eso se complica.
Utilice addEventListener en su lugar.
window.addEventListener('load', a_function); window.addEventListener('load', a_different_function);