Eu sou novo em JavaScript / jQuery e estou aprendendo a fazer funções. Muitas funções surgiram com (e) entre colchetes. Deixe-me mostrar o que quero dizer:
$(this).click(function(e) {
// does something
});
Sempre parece que a função nem mesmo usa o valor de (e), então por que ele está lá com tanta frequência?
Respostas:
eé a referência var curta para o eventobjeto que será passado para manipuladores de eventos.
O objeto de evento tem essencialmente muitos métodos e propriedades interessantes que podem ser usados nos manipuladores de eventos.
No exemplo que você postou, há um gerenciador de cliques que é um MouseEvent
$(<element selector>).click(function(e) {
// does something
alert(e.type); //will return you click
}
DEMO - Mouse Events DEMO usae.whichee.type
Algumas referências úteis:
http://api.jquery.com/category/events/
http://www.quirksmode.org/js/events_properties.html
http://www.javascriptkit.com/jsref/event.shtml
ISENÇÃO DE RESPONSABILIDADE: Esta é uma resposta muito tardia a este post em particular, mas como tenho lido várias respostas a esta pergunta, me ocorreu que a maioria das respostas usa terminologia que só pode ser entendida por programadores experientes. Essa resposta é uma tentativa de abordar a questão original com um público iniciante em mente.
A pequena coisa ' (e) ' é na verdade parte do escopo mais amplo de algo em Javascript chamado de função de tratamento de eventos. Cada função de tratamento de eventos recebe um objeto de evento. Para o propósito desta discussão, pense em um objeto como uma "coisa" que contém um monte de propriedades ( variáveis ) e métodos ( funções ), bem como objetos em outras linguagens. O identificador, o ' e ' dentro da pequena (e) coisa, é como uma variável que permite a você interagir com o objeto (e eu uso o termo variável MUITO vagamente).
Considere os seguintes exemplos de jQuery:
$("#someLink").on("click", function(e){ // My preferred method
e.preventDefault();
});
$("#someLink").click(function(e){ // Some use this method too
e.preventDefault();
});
O que está acontecendo?
Quando um usuário clica no elemento com o id "#someLink" (provavelmente uma tag âncora), chame uma função anônima, "function (e)" , e atribua o objeto resultante a um manipulador, "e" . Agora pegue esse manipulador e chame um de seus métodos, "e.preventDefault ()" , que deve evitar que o navegador execute a ação padrão para aquele elemento.
Nota: O identificador pode ser nomeado com qualquer coisa que você quiser (ou seja, ' função (billybob) '). O 'e' significa 'evento', o que parece ser bastante padrão para este tipo de função.
Embora 'e.preventDefault ()' seja provavelmente o uso mais comum do manipulador de eventos, o próprio objeto contém muitas propriedades e métodos que podem ser acessados por meio do manipulador de eventos.
Algumas informações realmente boas sobre este tópico podem ser encontradas no site de aprendizagem da jQuery, http://learn.jquery.com . Preste atenção especial às seções Usando jQuery Core e Eventos .
enão tem nenhum significado especial. É apenas uma convenção para usar ecomo nome de parâmetro de função quando o parâmetro é event.
Pode ser
$(this).click(function(loremipsumdolorsitamet) {
// does something
}
também.
Nesse exemplo, eé apenas um parâmetro para aquela função, mas é o eventobjeto que passa por ela.
O eargumento é curto para o objeto de evento. Por exemplo, você pode desejar criar um código para âncoras que cancele a ação padrão. Para fazer isso, você escreveria algo como:
$('a').click(function(e) {
e.preventDefault();
}
Isso significa que quando uma <a>tag é clicada, evita a ação padrão do evento de clique.
Embora você possa vê-lo com frequência, não é algo que você precise usar dentro da função, embora tenha especificado como um argumento.
Em jQuery, eabreviação de event, o objeto de evento atual. Geralmente é passado como um parâmetro para a função de evento a ser acionada.
Demonstração: eventos jQuery
Na demonstração que usei e
$("img").on("click dblclick mouseover mouseout",function(e){
$("h1").html("Event: " + e.type);
});
Eu posso muito bem ter usado event
$("img").on("click dblclick mouseover mouseout",function(event){
$("h1").html("Event: " + event.type);
});
Mesma coisa!
Os programadores são preguiçosos, usamos muitas abreviações, em parte isso diminui nosso trabalho e em parte ajuda na legibilidade. Entender isso ajudará você a entender a mentalidade de escrever código.
Hoje acabei de escrever um post sobre "Por que usamos as letras como“ e ”em e.preventDefault ()?" e acho que minha resposta fará algum sentido ...
Primeiro, vamos ver a sintaxe de addEventListener
Normalmente será: target.addEventListener (type, listener [, useCapture]);
E a definição dos parâmetros de addEventlistener são:
type： Uma string representando o tipo de evento a ser ouvido.
listener： O objeto que recebe uma notificação (um objeto que implementa a interface Event) quando ocorre um evento do tipo especificado. Deve ser um objeto que implementa a interface EventListener ou uma função JavaScript.
(De MDN)
Mas acho que há uma coisa que deve ser observada: quando você usa a função Javascript como o ouvinte, o objeto que implementa a interface de evento (evento de objeto) será automaticamente atribuído ao "primeiro parâmetro" da função. Portanto, se você usar função (e), o objeto será atribuído a "e" porque "e" é o único parâmetro da função (definitivamente o primeiro!), então você pode usar e.preventDefault para prevenir algo ....
vamos tentar o exemplo abaixo:
<p>Please click on the checkbox control.</p>
<form>
<label for="id-checkbox">Checkbox</label>
<input type="checkbox" id="id-checkbox"/>
</div>
</form>
<script>
document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
//var e=3;
var v=5;
var t=e+v;
console.log(t);
e.preventDefault();
}, false);
</script>
o resultado será: [objeto MouseEvent] 5 e você evitará o evento de clique.
mas se você remover o sinal de comentário como:
<script>
document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
var e=3;
var v=5;
var t=e+v;
console.log(t);
e.preventDefault();
}, false);
</script>
você obterá: 8 e um erro : "Uncaught TypeError: e.preventDefault não é uma função em HTMLInputElement. (VM409: 69)".
Certamente, o evento click não será evitado desta vez. Porque o "e" foi definido novamente na função.
No entanto, se você alterar o código para:
<script>
document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
var e=3;
var v=5;
var t=e+v;
console.log(t);
event.preventDefault();
}, false);
</script>
tudo funcionará corretamente novamente ... você receberá 8 e o evento de clique será evitado ...
Portanto, "e" é apenas um parâmetro de sua função e você precisa de um "e" em sua função () para receber o "objeto de evento" e realizar e.preventDefault (). Essa também é a razão pela qual você pode alterar o "e" para qualquer palavra que não esteja reservada por js.
$(this).click(function(e) {
// does something
});Em referência ao código acima
$(this)está o elemento que, como alguma variável.
clické o evento que precisa ser realizado.
o parâmetro eé passado automaticamente de js para sua função que contém o valor do $(this)valor e pode ser usado posteriormente em seu código para fazer alguma operação.