Em Javascript / jQuery, o que significa (e)?

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?

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

http://www.quirksmode.org/dom/events/index.html

http://www.w3.org/TR/DOM-Level-3-Events/#event-types-list

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.

Introdução

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();
});

Explicação

• "#someLink" é seu seletor de elemento (qual tag HTML irá acionar isso).
• "click" é um evento (quando o elemento selecionado é clicado).
• "function (e)" é a função de tratamento de eventos (no evento, o objeto é criado).
• "e" é o manipulador de objetos (o objeto fica acessível).
• "preventDefault ()" é um método (função) fornecido pelo objeto.

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.

É uma referência ao objeto de evento atual

$(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.