Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

marcioperdigao

Adicionar onclick em uma input usando javascript

Recommended Posts

Olá, como todo novato: sou novo no forum.

Tô com uma dúvida sobre como adicionar o atributo onclick em uma input usando o javascript. Eu consegui adicionar o value e o type.

Mas quando adiciono:

input.onclick=verificarSelecao(x); --->> Isso aqui faz com que ele já entre na função direto, e não funciona quando eu clico no input.

achei em 3 sites, ontem, mas não consigo achar os endereços novamente, mas não estavão diferentes, eles só colocaram a função direto no onlick.

 

 

function chooseYouDestiny() {
var interativo=document.getElementById("interativo");
var x=document.getElementById("song").value;
var ul=document.getElementById("opcoes");
var x=1;
interativo.innerHTML="Escolha a opção desejada";
for(var myOption in opcoesRadio){
var li=document.createElement("li");
var input=document.createElement("input");
input.type="radio";
input.value=x;
input.onclick=verificarSelecao(x);
var node=document.createTextNode(opcoesRadio[myOption]);
li.appendChild(input);
li.appendChild(node);
ul.appendChild(li);
x++;
}


}

Compartilhar este post


Link para o post
Compartilhar em outros sites

24 horas para descobir o problema. quando eu chamava a função, nessa linha:

input.onclick=verificarSelecao(x);

por alguma razão, se alguém souber responder seria bom porque queria passar o x como argumento.. essa função era chamada a cada interação do for, então eu tirei o parentese com o x e só deixei o nome da função, e pronto, funcionou.

Agora é ver como passar o valor de x sem ser por argumento.

Compartilhar este post


Link para o post
Compartilhar em outros sites

assim:

 

input.onclick = function(){
    verificarSelecao(x);
};
pq você precisa passar a função sem executá-la para a propriedade onclick. Por isso coloquei a anônima ali.

 

 

Falando nisso, prefira utilizar addEventListener:

input.addEventListener('click', function(){
    verificarSelecao(x);
});

Compartilhar este post


Link para o post
Compartilhar em outros sites

As 2 opções parecem funcionar da mesma forma, até foi legal, deu certo, entretanto elas só recebem o último valor atribuido a x, que seria 4. Ou seja, independente do buttom que eu click o valor do argumento é sempre 4. Eu pensei em como resolver isso, tentei colocar outros valores, mas o resultado é sempre o mesmo, é da sempre o ultimo valor.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Sim, pq o "contexto" faz isso. Execute assim:

function chooseYouDestiny() {
  var interativo = document.getElementById("interativo");
  var ul = document.getElementById("opcoes");
  var x = 1;

  interativo.innerHTML = "Escolha a opção desejada";

  for(var myOption in opcoesRadio){
    var li = document.createElement("li");
    var input = document.createElement("input");

    input.type = "radio";
    input.value = x;

    (function(x){
      input.addEventListener('click', function() {
         verificarSelecao(x);
      });
    }(x));

    var node = document.createTextNode(opcoesRadio[myOption]);

    li.appendChild(input);
    li.appendChild(node);
    ul.appendChild(li);
    x++;
  }
}

Compartilhar este post


Link para o post
Compartilhar em outros sites

Nossa, quando vi o que você fez até pausei o dota(não esperaram) pra poder testar essa sua ideia, brilhante. Deu certo, não sei como fecha o tópico, mas era só isso, resolvido. Vlw!

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.