Este código lo encontré aquí ¿Como puedo hacer para que aparezcan las primeras letras de las palabras en mayusculas? pero no lo sé adaptar. Lo que quiero es lo mismo que hace el script, pero en vez de mostrar como va quedando en el PRE, que lo valla modificando dentro del INPUT TEXT.
Con la ayuda lo hice de esta forma, pero no funciona, escribo texto en el INPUT y queda como lo escribo.
<!doctype html>
<html lang="es">
<head>
<meta charset="utf-8">
<script src="../jquery.min.js"></script>
<script type="text/javascript">
//Leva a mayúsculas la primera letra de cada palabra
function titleCase(texto) {
const re = /(^|[^A-Za-zÁÉÍÓÚÜÑáéíóúüñ])(?:([a-záéíóúüñ])|([A-ZÁÉÍÓÚÜÑ]))|([A-ZÁÉÍÓÚÜÑ]+)/gu;
return texto.replace(re,
(m, caracterPrevio, minuscInicial, mayuscInicial, mayuscIntermedias) => {
const locale = ['es', 'gl', 'ca', 'pt', 'en'];
//Son letras mayúsculas en el medio de la palabra
// => llevar a minúsculas.
if (mayuscIntermedias)
return mayuscIntermedias.toLocaleLowerCase(locale);
//Es la letra inicial de la palabra
// => dejar el caracter previo como está.
// => si la primera letra es minúscula, capitalizar
// sino, dejar como está.
return caracterPrevio
+ (minuscInicial ? minuscInicial.toLocaleUpperCase(locale) : mayuscInicial);
}
);
}
document.getElementById('ingreso')
.addEventListener('input',
event => {
document.getElementById('ingreso')
.value = titleCase(event.target.value);
}
);
</script>
</head>
<body>
<input type="text"
id="ingreso"
placeholder="Escribí texto para llevar a mayúsculas la primera letra de cada palabra"
style="width:100%">
</body>
</html>