AddEventListener não trabalhando em item específico

Question 1

Eu tenho algumas instâncias de addEventListner no meu código, e eles parecem funcionar bem, mas quando eu uso essa parte ele não faz nada. Eu estou tentando testá-lo com um simples alerta para que, quando você clicar na caixa de texto nome, um alerta aparece no topo, mas agora estou recebendo nada. Aqui está a minha para a caixa de nome e de minha addEventListener chamada:

  <div class="_form_element _x77561130 _full_width " >
    <div class="_field-wrapper form__input-wrapper form__input-wrapper--labelled">
      <input class="form__field form__field--large form__field--text" type="text" id="fname" name="firstname" placeholder="" />
      <label class="_form-label form__floating-label">
        First Name
      </label>
    </div>      
  </div>

e este é o meu apelo:

document.getElementById("fname").addEventListener("click", function() {
    alert("Hello World!");  
});

Question 2

Não há um monte de detalhes para ir no aqui - mas uma coisa fácil de esquecer, é de embrulhar o seu JS em uma função que verifica se a janela ou o documento foi carregado para que ele não o fogo antes que elementos existem. Seria útil fornecer qualquer console de erros.

window.addEventListener('load',function(){
 /* add your code here */
}

Confira esta resposta.

Question 3

O código de obras, no trecho abaixo, então, talvez o erro está em outro lugar.

document.getElementById("fname").addEventListener("click", function() {
    alert("Hello World!");  
});

<div class="_form_element _x77561130 _full_width " >
    <div class="_field-wrapper form__input-wrapper form__input-wrapper--labelled">
      <input class="form__field form__field--large form__field--text" type="text" id="fname" name="firstname" placeholder="" />
      <label class="_form-label form__floating-label">
        First Name
      </label>
    </div>      
  </div>

Brent Miller · Answer 1 · 2021-11-23T21:31:08

Não há um monte de detalhes para ir no aqui - mas uma coisa fácil de esquecer, é de embrulhar o seu JS em uma função que verifica se a janela ou o documento foi carregado para que ele não o fogo antes que elementos existem. Seria útil fornecer qualquer console de erros.

window.addEventListener('load',function(){
 /* add your code here */
}

Confira esta resposta.

Bom pensamento, mas eu não acho que esse é o problema, porque OP diz "eu tenho algumas instâncias de addEventListner no meu código, e eles parecem funcionar"

mrp · Answer 2 · 2021-11-23T21:44:18

O código de obras, no trecho abaixo, então, talvez o erro está em outro lugar.

document.getElementById("fname").addEventListener("click", function() {
    alert("Hello World!");  
});

<div class="_form_element _x77561130 _full_width " >
    <div class="_field-wrapper form__input-wrapper form__input-wrapper--labelled">
      <input class="form__field form__field--large form__field--text" type="text" id="fname" name="firstname" placeholder="" />
      <label class="_form-label form__floating-label">
        First Name
      </label>
    </div>      
  </div>

curiosamente, eu apaguei o trecho de código para o addEventListener, e colocá-lo novamente mais tarde e funcionou...nenhuma idéia por que, mas eu estou supondo que ele era apenas algo incomodando no back-end

AddEventListener não trabalhando em item específico

Pergunta

Em outros idiomas

Esta página está em outros idiomas

Popular nesta categoria

Perguntas populares nesta categoria