0

Hola comunidad espero me puedan ayudar si me agrega el otro input pero se borra lo que tengo en la primera

<input id="btnAgregar" type="button" value="Agregar" />
<div id="divAgregarInputs">
  <script>
  var btnElem = document.getElementById('btnAgregar');
var index = -1;
btnElem.onclick = function(evt) {
  index++;
  var divAgreg = document.getElementById('divAgregarInputs');
  divAgreg.innerHTML = divAgreg.innerHTML + '<input  " type="text" value="'  + '" /><br />';
}
</script>

introducir la descripción del enlace aquí`` introducir la descripción del enlace aquí

2 respuestas 2

0

Cambia esto:

divAgreg.innerHTML = divAgreg.innerHTML + '<input  " type="text" value="'  + '" /><br />';

por esto:

divAgreg.insertAdjacentHTML("beforeend",'<input type="text" value="" /><br />');

donde usamos insertAdjacentHTML() con su posición, en este caso beforeend, para agregar el contenido sin modificar ni releer todo el elemento.

Ejemplo:

<input id="btnAgregar" type="button" value="Agregar" />
<div id="divAgregarInputs">
</div>
<script>
  var btnElem = document.getElementById('btnAgregar');
  var index = -1;
  btnElem.onclick = function(evt) {
    index++;
    var divAgreg = document.getElementById('divAgregarInputs');
    divAgreg.insertAdjacentHTML("beforeend",'<input  type="text" value="' + index + '" /><br />');
  }
</script>

1
  • funciono gracias
    – Maria
    Commented el 23 nov. 2022 a las 19:46
0

De esta forma muy facil se puede agregar otro contenido al final del mismo.

El contenido de la constante agregar debe estar entre backtics ``.

Luego con inerHTML += se inserta en el DOM

const btnElem = document.getElementById('btnAgregar');
    const divAgreg = document.getElementById('divAgregarInputs');

    btnElem.onclick = function(evt) {

        const agregar = `
            <input type="text" value="'  + '" /><br />
        `;

        divAgreg.innerHTML += agregar;
    }
<input id="btnAgregar" type="button" value="Agregar" />
    <div id="divAgregarInputs">

2
  • 1
    El problema no era ese exactamente, sinó que si te fijas, si modificas un input y le cambias el valor, al darle otra vez al botón Agregar, se borra ese cambio pues se reescribe todo de nuevo con innerHTML.
    – masterguru
    Commented el 23 nov. 2022 a las 19:51
  • 1
    Si, ahora entiendo Commented el 23 nov. 2022 a las 19:55

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.