https://regexr.com/Esta página es super útil pues te explica como funciona un regex en concreto mientras te deja hacer pruebas en vivo. Tienes 3 errores, te explico:
Primero, usas el character class
^ fuera del grupo de caracteres que quieres dejar. Con eso, efectivamente estas invirtiendo la funcionalidad que quieres pues le estas diciendo:
Reemplaza todo que desde el principio hasta el final tenga una o más (+) letras (a-zA-Z). En tu caso solo se cumpliría si el input tuviese únicamente letras de la A a la Z. Para solucionarlo, podemos meter usar el character class
^ dentro del "grupo" de caracteres. De esa forma le estaríamos diciendo
que nos reemplace todo QUE NO SEAN letras (a-zA-Z).[^a-zA-Z]+$
Segundo, estas usando principio (
^) y fin (
$). Eso quiere decir que el el regex buscará que el texto sea valido de principio a fin y por tanto, en el momento en el que introduzcas un número, dejara de ser valido y no se aplicará.
[^a-zA-Z]+
Tercero, no estas usando el modificador global (
/g). Si no lo usas, recogerá sólo la primera coincidencia para reemplazar y dejará el resto.
[^a-zA-Z]+/g
Bonus, estas usando
keypress.
keypress al igual que
keydown son eventos que se ejecutan cuando la tecla es activada y por lo tanto no tienen en cuenta el nuevo valor añadido. Entonces, cuando yo pulse una tecla, aplicará ese reemplazo solo al valor anterior sin tener en cuenta la nueva tecla. Esto lo solucionas con
keyup que se ejecuta una vez la tecla ha sido levantada y el valor actualizado.
var form_registry = document.getElementById('form_registry');
form_registry.reg_name.addEventListener('keyup', function(e) {
form_registry.reg_name.value = String(form_registry.reg_name.value).replace(/[^a-zA-Z]+/g, '');
});
PD: Ten en cuenta, que A-Z no incluye a caracteres como Ñ Ç Á É Ö Ú Ó Í etc.
Saludos