El siguiente es mi código html:
<input type="text" class="form-control" id="emp" onkeypress="return (event.charCode > 64 && event.charCode < 91) || (event.charCode > 96 && event.charCode < 123)" > Tengo un botón de radio que, cuando está checked , debería eliminar el evento onkeypress y, cuando no está unchecked , debería activarlo. Este es mi js :
input.addEventListener('change', function() { if (input.checked) { document.getElementById("tag").innerHTML="No"; document.getElementById("emp").value=""; document.getElementById("emp").removeAttribute("onkeypress"); } else { document.getElementById("tag").innerHTML="Name"; document.getElementById("emp").value=""; document.getElementById("emp").setAttribute("onkeypress", ""); } });Pero cuando alterno el botón de opción, el código no funciona correctamente. ¿Podrías ayudarme?
Creo que es mejor manejar esta función en su función onkeypress , solo verifique si el botón de opción está checked , haga lo que quiera, si no, return null
Está configurando el atributo onkeypress en una cadena vacía en el caso desmarcado, por lo que no hará nada, igual que si se eliminara el atributo. Debería volver a configurarlo en el texto original, que podría obtener con getAttribute y almacenar.
var onkeypress_code = document.getElementById("emp").getAttribute("onkeypress"); input.addEventListener('change', function() { if (input.checked) { document.getElementById("tag").innerHTML="No"; document.getElementById("emp").value=""; document.getElementById("emp").removeAttribute("onkeypress"); } else { document.getElementById("tag").innerHTML="Name"; document.getElementById("emp").value=""; document.getElementById("emp").setAttribute("onkeypress", onkeypress_code); } }); Pero yo recomendaría hacer esto de manera diferente. Puede usar addEventListener y removeEventListener (eliminando onkeypress del HTML):
function emp_onkeypress(event) { return ( (event.charCode > 64 && event.charCode < 91) || (event.charCode > 96 && event.charCode < 123) ); } function checkbox_onchange(event) { if (input.checked) { document.getElementById("tag").innerHTML="No"; document.getElementById("emp").value=""; document.getElementById("emp").removeEventListener("keypress", emp_onkeypress); } else { document.getElementById("tag").innerHTML="Name"; document.getElementById("emp").value=""; document.getElementById("emp").addEventListener("keypress", emp_onkeypress); } } input.addEventListener('change', checkbox_onchange); checkbox_onchange(); // update based on initial checkbox state O simplemente puede manejar el estado marcado/no marcado en su controlador de pulsación de tecla. Si define el controlador de pulsación de tecla en su JS, tendrá acceso a la variable de input .
function emp_onkeypress(event) { if (input.checked) { return; } return ( (event.charCode > 64 && event.charCode < 91) || (event.charCode > 96 && event.charCode < 123) ); } document.getElementById("emp").addEventListener("keypress", emp_onkeypress); input.addEventListener('change', function() { if (input.checked) { document.getElementById("tag").innerHTML="No"; document.getElementById("emp").value=""; } else { document.getElementById("tag").innerHTML="Name"; document.getElementById("emp").value=""; } }); Además, charCode está en desuso; key y code son las API recomendadas.