Co w Javascript / jQuery oznacza (e)?

Jestem nowy w JavaScript / jQuery i uczyłem się tworzyć funkcje. Wiele funkcji zostało wyświetlonych z (e) w nawiasach. Pokażę ci, co mam na myśli:

$(this).click(function(e) {
    // does something
});

Zawsze okazuje się, że funkcja nie używa nawet wartości (e), więc dlaczego jest tam tak często?

eto krótkie odwołanie do zmiennej eventobiektu, które zostanie przekazane do programów obsługi zdarzeń.

Obiekt zdarzenia zasadniczo ma wiele interesujących metod i właściwości, których można używać w programach obsługi zdarzeń.

W przesłanym przez Ciebie przykładzie jest moduł obsługi kliknięć, który jest plikiem MouseEvent

$(<element selector>).click(function(e) {
    // does something
    alert(e.type); //will return you click
}

DEMO - zdarzenia myszy DEMO używae.whichie.type

Kilka przydatnych odniesień:

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

ZRZECZENIE SIĘ: To jest bardzo późna odpowiedź na ten konkretny post, ale kiedy czytałem różne odpowiedzi na to pytanie, uderzyło mnie, że większość odpowiedzi używa terminologii zrozumiałej tylko dla doświadczonych programistów. Ta odpowiedź jest próbą odpowiedzi na pierwotne pytanie z myślą o początkującej publiczności.

Intro

Mała rzecz „ (e) ” jest w rzeczywistości częścią szerszego zakresu czegoś w JavaScript zwanego funkcją obsługi zdarzeń. Każda funkcja obsługi zdarzenia otrzymuje obiekt zdarzenia. Na potrzeby tej dyskusji pomyśl o obiekcie jako o „rzeczy”, która przechowuje zbiór właściwości ( zmiennych ) i metod ( funkcji ), podobnie jak obiekty w innych językach. Uchwyt, „ e ” wewnątrz małej (e) rzeczy, jest jak zmienna, która pozwala na interakcję z obiektem (a ja używam terminu zmienna BARDZO luźno).

Rozważ następujące przykłady jQuery:

$("#someLink").on("click", function(e){ // My preferred method
    e.preventDefault();
});

$("#someLink").click(function(e){ // Some use this method too
    e.preventDefault();
});

Wyjaśnienie

• „#someLink” to selektor elementu (który tag HTML to wywoła).
• „kliknięcie” to zdarzenie (po kliknięciu wybranego elementu).
• „funkcja (e)” jest funkcją obsługi zdarzenia (w przypadku zdarzenia tworzony jest obiekt).
• „e” jest obsługą obiektu (obiekt jest udostępniany).
• „PreventDefault ()” to metoda (funkcja) udostępniana przez obiekt.

Co się dzieje?
Kiedy użytkownik kliknie element o identyfikatorze „#someLink” (prawdopodobnie tag kotwicy), wywołaj anonimową funkcję „function (e)” i przypisz wynikowy obiekt do modułu obsługi „e” . Teraz weź tę procedurę obsługi i wywołaj jedną z jej metod, „e.preventDefault ()” , co powinno uniemożliwić przeglądarce wykonanie domyślnej akcji dla tego elementu.

Uwaga: Uchwyt można nazwać dowolnie, jak chcesz (np. „ Funkcja (billybob) ”). Litera „e” oznacza „zdarzenie”, co wydaje się być dość standardowe dla tego typu funkcji.

Chociaż „e.preventDefault ()” jest prawdopodobnie najpowszechniejszym zastosowaniem procedury obsługi zdarzeń, sam obiekt zawiera wiele właściwości i metod, do których można uzyskać dostęp za pośrednictwem modułu obsługi zdarzeń.

Kilka naprawdę dobrych informacji na ten temat można znaleźć w witrynie edukacyjnej jQuery, http://learn.jquery.com . Zwróć szczególną uwagę na sekcje Korzystanie z jQuery Core i Events .

enie ma żadnego specjalnego znaczenia. Konwencja jest używana ejako nazwa parametru funkcji, gdy parametrem jest event.

To może być

$(this).click(function(loremipsumdolorsitamet) {
    // does something
}

także.

W tym przykładzie ejest to tylko parametr tej funkcji, ale jest to eventobiekt, który jest przez nią przekazywany.

eArgument jest skrótem od obiektu zdarzenia. Na przykład możesz chcieć utworzyć kod dla kotwic, który anuluje domyślną akcję. Aby to zrobić, napisałbyś coś takiego:

$('a').click(function(e) {
    e.preventDefault();
}

Oznacza to, że <a>kliknięcie tagu zapobiega domyślnemu działaniu zdarzenia kliknięcia.

Chociaż możesz to często widzieć, nie jest to coś, czego musisz używać w funkcji, nawet jeśli określiłeś to jako argument.

W jQuery eskrót eventod bieżącego obiektu zdarzenia. Zwykle jest przekazywany jako parametr uruchamianej funkcji zdarzenia.

Demo: jQuery Events

W wersji demonstracyjnej, której użyłem e

$("img").on("click dblclick mouseover mouseout",function(e){
        $("h1").html("Event: " + e.type);
}); 

Równie dobrze mogłem użyć event

 $("img").on("click dblclick mouseover mouseout",function(event){
            $("h1").html("Event: " + event.type);
    }); 

Ta sama rzecz!

Programiści są leniwi, używamy dużo skrótów, częściowo zmniejsza to naszą pracę, częściowo pomaga w czytelności. Zrozumienie tego pomoże ci zrozumieć mentalność pisania kodu.

Dzisiaj właśnie napisałem post na temat „Dlaczego używamy liter takich jak„ e ”w e.preventDefault ()?” i myślę, że moja odpowiedź będzie miała jakiś sens ...

Najpierw zobaczmy składnię addEventListener

Zwykle będzie to: target.addEventListener (typ, listener [, useCapture]);

A definicje parametrów addEventlistener to:

typ： Łańcuch reprezentujący typ zdarzenia, którego nasłuchujemy.

listener： Obiekt, który otrzymuje powiadomienie (obiekt implementujący interfejs Event), gdy wystąpi zdarzenie określonego typu. Musi to być obiekt implementujący interfejs EventListener lub funkcja JavaScript.

(Z MDN)

Myślę jednak, że należy zwrócić uwagę na jedną rzecz: kiedy używasz funkcji JavaScript jako nasłuchiwania, obiekt implementujący interfejs zdarzenia (zdarzenie obiektu) zostanie automatycznie przypisany do „pierwszego parametru” funkcji. Tak więc, jeśli używasz function (e), obiekt zostanie przypisany do "e", ponieważ "e" jest jedynym parametrem funkcji (na pewno pierwszym!), wtedy możesz użyć e.preventDefault, aby temu zapobiec ....

spróbujmy poniższy przykład:

<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>

wynikiem będzie: [obiekt MouseEvent] 5 i zapobiegniesz zdarzeniu kliknięcia.

ale jeśli usuniesz znak komentarza, taki jak:

<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>

otrzymasz: 8 i błąd : „Uncaught TypeError: e.preventDefault nie jest funkcją w HTMLInputElement. (VM409: 69)”.

Z pewnością zdarzenie kliknięcia nie zostanie tym razem zablokowane, ponieważ litera „e” została ponownie zdefiniowana w funkcji.

Jeśli jednak zmienisz kod na:

<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>

wszystko znowu będzie działać poprawnie ... otrzymasz 8 i unikniesz zdarzenia kliknięcia ...

Dlatego „e” jest tylko parametrem Twojej funkcji i potrzebujesz „e” w swojej funkcji (), aby otrzymać „obiekt zdarzenia”, a następnie wykonać e.preventDefault (). Jest to również powód, dla którego możesz zmienić „e” na dowolne słowa, które nie są zastrzeżone przez js.

Jest to odniesienie do bieżącego obiektu zdarzenia

$(this).click(function(e) {
    // does something
});

W odniesieniu do powyższego kodu
$(this)jest to element będący jakąś zmienną.
clickto wydarzenie, które należy wykonać.
parametr ejest automatycznie przekazywany z js do funkcji, która przechowuje wartość $(this)value i może być dalej używana w kodzie do wykonywania pewnych operacji.