Estoy tratando de crear un párrafo con contenteditable habilitado, donde ingresará el valor. Más tarde, al presionar el botón "Enviar", quiero que active la función si, de lo contrario, tomará el número que el usuario escribió en el contenido editable. Después de verificar la función if-else, quiero que ese resultado se muestre en otro párrafo. Si el número es > 4, debería decir aprobado, y si <, fallado. No puedo entender cómo al presionar el botón se activa la función que leerá mi número de párrafo y luego se activará la función if. Debe tener un aspecto como este
Mi código
<h2>Enter data</h2> <p><span contenteditable="true" id="iev"> </span></p> <button onclick="nep()">Check!</button> <br><br><br> <h2>Result</h2><br> <span contenteditable="true" id="izv"> </span>y para el guión:
var rezultats = ""; var izv = document.getElementById("izv"); vertejums = document.getElementById("iev"); rezultats = parseFloat(vertejums); function nep() { if (rezultats >=4.0) izvads = "Passed!" else izvads = "Failed!"; izv = document.getElementById("izv"); izv.innerHTML = izvads; }¡Gracias!
Holaaa. debe pasar la función en el caso de hacer clic en este botón para que se ejecute
<button onclick={nep()}>Check!</button>agregue textContent y vuelva a formatear el código, ejemplo funcional:
var rezultats = ""; document.getElementById("poga1").onclick = function () { let izv = document.getElementById("izv"); let vertejums = document.getElementById("iev"); let rezultats = parseFloat(vertejums.textContent); return nep(rezultats); }; function nep(rezultats) { console.log({ rezultats }); if (rezultats >= 4.0) { izvads = "Passed!"; } else { izvads = "Failed!"; } izv = document.getElementById("izv"); izv.innerHTML = izvads; } const head = document.getElementsByTagName("head"); head[0].style.textAlign = "left"; const main = document.getElementsByTagName("main"); main[0].style.width = "33rem"; main[0].style.margin = "auto"; main[0].style.textAlign = "center"; main[0].style.border = "solid 3px green"; const h2 = document.getElementsByTagName("h2"); h2[0].style.margin = "0"; h2[0].style.padding = "1rem 0.25rem"; h2[0].style.backgroundColor = "#f5a9d7"; const p = document.getElementsByTagName("p"); p[0].style.padding = "0.5rem"; p[0].style.margin = "2.5rem"; p[0].style.backgroundColor = "#f2e2ec"; <!DOCTYPE html> <html> <head> <title>Parcel Sandbox</title> <meta charset="UTF-8" /> </head> <body> <h2>Ievadi datus</h2> <p>Ievade<span contenteditable="true" id="iev">5</span></p> <button id="poga1">Check!</button> <br /><br /><br /> <h2>Rezultāts</h2> <br /> <span contenteditable="true" id="izv">Vispirms ievadi datus!</span> <br /> <br /> <br /> </body> </html>