metodo onclick() não envia como parametro o objeto event

[Danilo Moraes]

Pessoal, estou com um problema: Preciso disparar o evento de um link com javascript e enviar junto o objeto event desse link...

tipo:

function funcao(e) {
  alert(e.target.getAttribute("id"));
}

var link = document.getElementById("link");

window.onload = function() {
  link.onclick = funcao;
  link.onClick();
}
<a href="#" id="link">link</a>

Bom, quando a pagina carrega, retorna o erro de que "e" não é definido. já quando eu clico no link, o alert mostra o id: link.

Isso significa que o metodo onclick() não esta enviando o objeto event, referente ao link como parametro. alguém sabe como resolver isso?

Obrigado

[SK15]

Até onde eu saiba isso non-existe ... seu código da erro sem choro aqui; pois 'onClick' é um evento e não uma função; ou seja ele só existe quando o usuário clica gerando o evento (clicar o mouse por exemplo) na hora que o usuário fizer ... no seu caso séria o código mais correto é ...

<script>
function funcao(e) {
  alert(e.getAttribute("id"));
}
</script>
<a href="#" onClick="funcao(this);" id="link">link</a>

Para você eviar o objeto do link ao carregar como se fose um clique instantaneo é mais fácil e funcional pegar ele e depois enviar direto para a função ...

<script>
function funcao(e) {
  alert(e.getAttribute("id"));
}

window.onload = function() {
 var Hlink = document.getElementById("link");
 funcao(Hlink);
}
</script>
<a href="#" id="link">link</a>

Editado Agosto 20, 2009 por SK15

[Danilo Moraes]

Olha, o script acima não funcionou porque não estava entre as tags <script> e a criacao da variavel link, estava fora da funcao onload. então o link tecnicamente ainda não tinha sido criado. E a proposito, existe tanto o evento onclick quanto o metodo onclick() que dispara o evento.

<script>
function funcao(e) {
  alert(e.target.getAttribute("id"));
}

window.onload = function() {
var link = document.getElementById("link");
  link.onclick = funcao;
  link.onClick();
}
</script>
<a href="#" id="link">link</a>

Testa esse ai agora... Quando a pagina carrega, ele não mostra o alert porque o objeto "e" não existe, mas quando o usuario dispara o evento, ele passa a existir... Preciso que esse objeto event seja criado mesmo quando eu executo o metodo onclick(). alguém sabe como?

[Jonathan Queiroz]

O evento onclick é também uma função.

Não existem diferenças. O que ocorre é que quando o usuário clica em um elemento, o interpretador JS verifica se há esse atributo e, se existir, chama a função.

O problema no seu script ocorreu porque o javascript é case-sensitive.

Infelizmente o HTML ignora as diferenças entre caixa alta ou baixa em atributos de elementos.

Tente assim:

link.onclick = funcao;
link.onclick();

[Danilo Moraes]

Esse post foi criado sem querer :S E não sei como deletalo :( Desculpem o flood :S

Editado Agosto 20, 2009 por Danilo Moraes

[Danilo Moraes]

Olha pessoal, acredito que ninguém intendeu minha pergunta, então vamos la. Eu já achei uma solucao alternativa para resolver meu problema e vou esperar ate amanha para posta-la. Se alguém conseguir resolver meu problema, ficarei extremamente agradecido!!

Bom, primeiramente Jonathan Queiroz, Ali nos posts anteriores, eu acabei escrevendo errado o nome do metodo, mas mesmo colocando o onclick() o "erro" ainda persiste.

Vamos a uma rapida introducao:

Bom, existe no javascript um objeto chamado event (com "e" minusculo) que armazena as propriedades de um determinado objeto. Esse objeto event so é criado quano um evento é disparado. Bom, aki segue um simples exemplo da utilizacao desse objeto event:

<script type="text/javascript">
  function mostraPropriedade(e) {//esse parametro, vai ser preenchido automaticamente quando o evento for disparado
    alert(e.target.getAttribute("href"));//esse exemplo so vai funcionar no firefox porque no IE, o objeto event é criado em window.event
  }
//para que o objeto event seja passado como parametro para a funcao, precisamos atribuir a funcao ao evento onclick de um elemento html

window.onload = function(){//colocamos tudo dentro desse evento porque quando o interpretador ler este codigo, o codigo html ainda não tera sido criado então ele não vai
//conseguir achar o elemento "meulink" a não ser que o codigo html já tenha sido carregado

   var link = document.getElementById("meulink");
   link.onclick = mostraPropriedade;//aki não colocamos os "()" porque queremos atribuir a funcao em si ao evento onclick e não o resultado da funcao... Isso tem a ver com //ponteiros :P
}
<script>
<body>
<a href="#meuHref" id="meulink">clique</a>
</body>

Bom, o codigo esta bem comentado, então e so testar. vocês vao ver que vai aparecer um alert com o conteudo #meuHref... Como isso aconteceu? Quando o usuario clicou no link, foi disparado o evento onclick que estava atrelado a ele. Esse evento chamou a funcao mostraPropriedade(). Quando essa funcao foi chamada, foi passado como parametro (pelo proprio interpretador js) um objeto chamado: event. Esse objeto é criado quando um evento e disparado e ele contem as principais propriedades do elemento em questao. Por exemplo:

function mostraPropriedade(e) {//no lugar desse "e" poderia ser usado qualquer outro nome
 alert(e.type)//vai retornar a string: click já que o tipo do evento é click.
alert(e)//vai retornar: [object MouseEvent] já que faz mensao á origem do evento...
alert(e.target)//no FF vai retornar a principal propriedade do elemento. Nesse caso, vai retornar o href contendo todo o caminho ate a pagina atual. Exemplo: file:///home/danilom/Desktop/testeEventos.html#meulink
alert(window.event.srcElement)//mesma coisa que o e.target, so que é a versao para o nosso querido IEca :P
}

Bom, como puderam ver, esse objeto event, contem varias propriedades do elemento em questao. Agora vamos tentar de uma maneira diferente... Em vez de o usuario disparar o evento clicando no link, vamos disparar o evento atraves do metodo onclick():

<script type="text/javascript">

  function mostraPropriedade(e) {
    alert(e);
  }

window.onload = function(){

   var link = document.getElementById("meulink");
   link.onclick = mostraPropriedade;
   link.onclick();
}
<script>
<body>
<a href="#meuHref" id="meulink">clique</a>
</body>

Se executarem esse exemplo, quando a pagina carregar, vai aparecer um alert com a string: Undefined... Isso significa que o objeto event não foi criado. Com isso cheguei a conclusao de que eventos disparados via metodos, não criam o objeto event :(

Agora depois desse discuro (:D), alguém sabe como eu faco para disparar eventos via metodo onclick() e ainda criar e enviar o objeto event como parametro?

Bom, eu já achei um solucao alternativa para esse problema, mas ela não meche com o objeto event, que é exatamente o que eu não sei como fazer... So não posto esse minha alternativa porque não quero que esse tópico seja dado como RESOLVIDO antes que alguém me diga alguma coisa que sabe ^^

Amanha ou depois, venho aki e posto minha solucao...

Mas por favor, alguém tem ideia de como fazer o que eu quero?

Thanks :P

Editado Agosto 20, 2009 por Danilo Moraes

[Jonathan Queiroz]

Outra forma de se fazer isso seria, ao invés do event, utilizar o this para referenciar o elemento que você está utilizando.

Algo assim:

function teste(){
alert(this.getAttribute("id"))
}
onload=function(){
elemento=document.getElementById("aaa")
elemento.onclick=teste
elemento.onclick()
}

Utilizando o event não sei como fazer, até porque ao chamar o evento dessa forma você está chamando apenas a função já atribuída (seria como chamar uma função, que na verdade é uma variável, dentro de uma classe.)

[Danilo Moraes]

Utilizando o event não sei como fazer, até porque ao chamar o evento dessa forma você está chamando apenas a função já atribuída (seria como chamar uma função, que na verdade é uma variável, dentro de uma classe.)

Pior que é... Mas eu tava lendo num e-book, que quando você atribui o evento inline, você pode passar literalmente o objeto event como parametro, mais ou menos assim:

<a href="#" onclick="funcao(event)">link</a>

Bom, agora o esquema, é descobrir como passar parametro na hora de tribuir funcoes... tipo:

obj.onclick = funcao;//se tivece como fazer assim: obj.onclick = funcao(event)...
obj.onclick(event);//ou assim.... =/

Bom, amanha vou fazer a funcao para resolver esse problema ai. Na verdade, o metodo que eu bolei e quase igual ao do Jonathan ^^ Amanha posto aew, to meio ocupado agora :S T+

[Jonathan Queiroz]

Sim, é possível passar o parâmetro event diretamente, mas ele não irá se referir ao evento onclick.

Só um exemplo: O código que você está utilizando para chamar a outra função está no evento onload. Se você tentar passar o valor do event o que chegará como parâmetro é referente ao evento onload da página.

[Danilo Moraes]

tipo, eu não consegui passar como parametro o objeto evento para capturar informacoes do evento onload. Sera que tem mesmo como fazer isso?