Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

93
Visualizações
EventListener en un nuevo elemento agregado con JavaScript que no se activa debido a que el valor del elemento parece ser nulo

Soy nuevo con js e intento, con mi conocimiento actual, hacer que esto funcione, pero no puedo. En el HTML principal tengo este botón que, al hacer clic, agrega contenido nuevo a otra sección del HTML principal. Este nuevo contenido también tiene otros botones. Quería agregarles EventListeners, pero fallaba constantemente. Intenté arreglar esto con muchas alternativas. Por ejemplo, en el nuevo código HTML, agregar en la etiqueta del botón un onclick="function" pero tampoco funciona. Me estoy subiendo a la consola:

TypeError no capturado: no se pueden leer las propiedades de nulo (leyendo 'valor')

Leí algunas opciones diferentes que van más allá de mi conocimiento o algunas opciones que hablan de esperar que el DOM cargue ese elemento antes de aplicar el detector de eventos, pero no sé cómo hacerlo. Este es el código hasta ahora:

 let hxr = document.querySelector('.hxr'); let content = document.querySelector('.content'); hxr.addEventListener('click',()=>{ content.classList.remove('content'); content.classList.add('frdesign'); if (content.classList.contains('bndesign')||content.classList.contains('hxrdesign')){ content.classList.remove('bndesign'); content.classList.remove('hxrdesign'); } else {}; content.innerHTML = ` <h3 class="title">numeros</h3> <div autocomplete="off" class="contenedor"> <input type="text" class="inputs uno" placeholder="agregar"> <button class="inputs dos">Confirm</button> </div> <div class="contenedor2"> <button class="inputs reset">Reset</button> <button class="inputs resultado"></button> <button type="reset" class="inputs confirmar">realizar</button> </div> `; }); let btn1 = document.querySelector(".uno"); let btn2 = document.querySelector(".dos"); let res = document.querySelector(".resultado"); let confirmar = document.querySelector(".confirmar"); let list = []; btn2.addEventListener('click',()=>{ if (btn1.value!==''){ list.push(btn1.value); } else {} btn1.value=''; });

El caso es que el detector de eventos en hrx funciona bien porque agrega este nuevo contenido HTML y también el CSS se aplica correctamente. La parte que no funciona es la de abajo, el detector de eventos btn2 no se activa porque parece que btn1 es nulo (lo intenté en la consola). También probé este código en otro archivo por sí mismo y funciona. Si necesita más detalles solo pregunte, ¡gracias!

about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda