De inicio te digo que el
id
debe de ser un valor único en todo el documento. Puedes usar clases o nombres los cuales sí pueden repetirse.
Código HTML:
Ver original<input type = "text" class = "ejemplo" /> <input type = "text" class = "ejemplo" /> <input type = "text" class = "ejemplo" />
Y si deseas que la función afecte a todos los elementos, puedes hacerlo o bien con JavaScript en línea:
Código HTML:
Ver original<input type = "text" class = "ejemplo" oninput = "fagrega(this)" />
O delegando la función con el método
addEventListener
(ya no usarías la forma anterior):
Código Javascript
:
Ver original[].forEach.call(document.querySelectorAll(".ejemplo"), function(element){
element.addEventListener("input", function(){
//Do stuff
}, false);
});
Supongo que lo que buscas es que cada
<input>
oculto tome el valor escrito en la caja equivalente del grupo de arriba, entonces, podrías hacerlo así:
Código HTML:
Ver original<input type = "text" class = "ingresa" /> <input type = "text" class = "ingresa" /> <input type = "text" class = "ingresa" />
<input type = "hidden" class = "guarda" /> <input type = "hidden" class = "guarda" /> <input type = "hidden" class = "guarda" />
Código Javascript
:
Ver original[].forEach.call(document.querySelectorAll(".ingresa"), function(element, index){
element.addEventListener("input", function(){
document.querySelectorAll(".guarda")[index].value = this.value;
}, false);
});
El segundo argumento que puede recibir la llamada de retorno del método
forEach
es la posición que ocupa el elemento actual en el bucle en el array o conjunto de elementos (en este caso, de nodos) y es ese el valor que utilizo para tomar al
<input>
oculto equivalente al que estamos ingresando datos.
Saludos
EDITO: Por leer rápido, no me dí cuenta de que lo tienes son cajas de texto inhabilitadas mas no ocultas. De todas formas, funciona igual.