Soy un desarrollador de django que no es bueno en javascript. Tengo una plantilla de django para la que realmente quiero usar Javascript. Intenté leer en línea para obtener ayuda, pero no entiendo
Quiero agregar un addEventlistener a este código a continuación
<div class="box-element hidden" id="request-info"> <button id="send-payment">Send request</button> Además, quiero que muestre una respuesta cuando se envíe. Respuesta como "Solicitud enviada". Por favor, sé sobre console.log , no lo quiero en console.log .
Sé que JS es realmente bueno en esto.
Entonces, presumiblemente, desea agregar un detector de eventos al botón para que se envíe cuando se haga clic. Puede hacerlo agregando un detector de eventos al elemento entre dos etiquetas de <script></script> o en su archivo .js. El código se vería así:
document.getElementById("send-payment").addEventListener("click", function() { /* Action Here... */ alert("Request Sent!") // This will throw up an alert to the user. })Por lo que deduzco, esta debería ser una solución simple, puede encontrar más documentación aquí: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener
Necesita un espacio para mostrar el mensaje "Solicitud enviada". Aquí uso la etiqueta p
<div class="box-element hidden" id="request-info"> <button id="send-payment">Send request</button> <p id="response"></p> <script> document.getElementById("send-payment").addEventListener("click", function(){ document.getElementById("response").innerHTML = "Request sent"; }) </script>Aquí está el enlace en w3schools: https://www.w3schools.com/jsref/met_document_addeventlistener.asp
Hacer esto
const button = document.getElementById("send-payment"); button.addEventListener("click", function() { document.getElementById("request-info").style.display = "block"; }) #request-info { display: none; color: green; font-size: 12px; margin-bottom: 10px; } <div id="request-info">Request sent</div> <button id="send-payment">Send request</button>