Dalam Javascript / jQuery apa artinya (e)?

Saya baru mengenal JavaScript / jQuery dan saya telah mempelajari cara membuat fungsi. Banyak fungsi telah dipotong dengan (e) dalam tanda kurung. Izinkan saya menunjukkan apa yang saya maksud:

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

Selalu tampak bahwa fungsi tersebut bahkan tidak menggunakan nilai (e), jadi mengapa begitu sering terjadi?

e adalah referensi var singkat untuk event objek yang akan diteruskan ke penangan kejadian.

Objek acara pada dasarnya memiliki banyak metode dan properti menarik yang dapat digunakan dalam penanganan acara.

Dalam contoh yang telah Anda posting adalah handler klik yang merupakan MouseEvent

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

DEMO - Mouse Events DEMO menggunakane.whichdane.type

Beberapa referensi berguna:

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

PENAFIAN: Ini adalah tanggapan yang sangat terlambat untuk posting khusus ini tetapi karena saya telah membaca berbagai tanggapan atas pertanyaan ini, saya tersadar bahwa sebagian besar jawaban menggunakan terminologi yang hanya dapat dipahami oleh pembuat kode berpengalaman. Jawaban ini merupakan upaya untuk menjawab pertanyaan orisinal dengan memikirkan audiens pemula.

Intro

Hal kecil ' (e) ' sebenarnya adalah bagian dari cakupan yang lebih luas dari sesuatu dalam Javascript yang disebut fungsi penanganan peristiwa. Setiap fungsi penanganan acara menerima objek acara. Untuk tujuan diskusi ini, pikirkan sebuah objek sebagai "benda" yang menyimpan sekumpulan properti ( variabel ) dan metode ( fungsi ), seperti objek dalam bahasa lain. Pegangannya, ' e ' di dalam benda kecil (e) , seperti variabel yang memungkinkan Anda untuk berinteraksi dengan objek (dan saya menggunakan istilah variabel SANGAT longgar).

Pertimbangkan contoh jQuery berikut:

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

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

Penjelasan

• "#someLink" adalah pemilih elemen Anda (tag HTML mana yang akan memicu ini).
• "klik" adalah peristiwa (ketika elemen yang dipilih diklik).
• "function (e)" adalah fungsi penanganan acara (pada acara, objek dibuat).
• "e" adalah penangan objek (objek dibuat dapat diakses).
• "preventDefault ()" adalah metode (fungsi) yang disediakan oleh objek.

Apa yang terjadi?
Saat pengguna mengklik elemen dengan id "#someLink" (mungkin berupa tag anchor), panggil fungsi anonim, "function (e)" , dan tetapkan objek yang dihasilkan ke handler, "e" . Sekarang ambil penangan itu dan panggil salah satu metodenya, "e.preventDefault ()" , yang seharusnya mencegah browser melakukan tindakan default untuk elemen itu.

catatan: Pegangan dapat diberi nama apa pun yang Anda inginkan (yaitu ' function (billybob) '). 'E' adalah singkatan dari 'event', yang tampaknya cukup standar untuk jenis fungsi ini.

Meskipun 'e.preventDefault ()' mungkin adalah penggunaan paling umum dari pengendali kejadian, objek itu sendiri berisi banyak properti dan metode yang bisa diakses melalui pengendali kejadian.

Beberapa informasi yang sangat bagus tentang topik ini dapat ditemukan di situs pembelajaran jQuery, http://learn.jquery.com . Berikan perhatian khusus pada bagian Menggunakan jQuery Core and Events .

etidak memiliki arti khusus. Ini hanya sebuah konvensi untuk digunakan esebagai nama parameter fungsi ketika parameternya adalah event.

Bisa jadi

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

demikian juga.

Dalam contoh itu, ehanyalah sebuah parameter untuk fungsi itu, tapi itu adalah eventobjek yang dilewati.

The eargumen adalah singkat untuk objek acara. Misalnya, Anda mungkin ingin membuat kode untuk jangkar yang membatalkan tindakan default. Untuk melakukan ini, Anda akan menulis sesuatu seperti:

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

Artinya ketika file <a> tag diklik, cegah tindakan default dari peristiwa klik.

Meskipun Anda mungkin sering melihatnya, itu bukan sesuatu yang harus Anda gunakan di dalam fungsi meskipun Anda telah menetapkannya sebagai argumen.

Dalam jQuery ekependekan dari event, objek acara saat ini. Biasanya diteruskan sebagai parameter untuk fungsi acara yang akan diaktifkan.

Demo: Acara jQuery

Dalam demo yang saya gunakan e

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

Saya mungkin juga telah menggunakan event

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

Hal yang sama!

Programmer malas kita menggunakan banyak singkatan, sebagian mengurangi pekerjaan kita, sebagian lagi membantu keterbacaan. Memahami itu akan membantu Anda memahami mentalitas menulis kode.

Hari ini saya baru saja menulis postingan tentang "Mengapa kita menggunakan huruf seperti" e "di e.preventDefault ()?" dan saya pikir jawaban saya akan masuk akal ...

Pertama, mari kita lihat sintaks addEventListener

Biasanya akan menjadi: target.addEventListener (type, listener [, useCapture]);

Dan definisi dari parameter addEventlistener adalah:

type： Sebuah string yang merepresentasikan tipe event yang akan didengarkan.

listener： Objek yang menerima notifikasi (objek yang mengimplementasikan antarmuka Event) ketika sebuah event dari tipe yang ditentukan terjadi. Ini harus berupa objek yang mengimplementasikan antarmuka EventListener, atau fungsi JavaScript.

(Dari MDN)

Tapi saya pikir ada satu hal yang harus diperhatikan: Ketika Anda menggunakan fungsi Javascript sebagai pendengar, objek yang mengimplementasikan antarmuka Acara (acara objek) akan secara otomatis ditetapkan ke "parameter pertama" dari fungsi tersebut. Jadi, jika Anda menggunakan function (e), objek akan ditetapkan ke "e" karena "e" adalah satu-satunya parameter fungsi (pasti yang pertama!), maka Anda dapat menggunakan e.preventDefault untuk mencegah sesuatu ....

mari kita coba contoh seperti di bawah ini:

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

hasilnya akan menjadi: [object MouseEvent] 5 dan Anda akan mencegah event click.

tetapi jika Anda menghapus tanda komentar seperti:

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

Anda akan mendapatkan: 8 dan kesalahan : "Uncaught TypeError: e.preventDefault bukan fungsi di HTMLInputElement. (VM409: 69)".

Tentu saja, peristiwa klik tidak akan dicegah kali ini. Karena "e" telah didefinisikan lagi dalam fungsi tersebut.

Namun, jika Anda mengubah kode menjadi:

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

semuanya akan bekerja dengan baik lagi ... Anda akan mendapatkan 8 dan peristiwa klik dicegah ...

Oleh karena itu, "e" hanyalah parameter dari fungsi Anda dan Anda memerlukan "e" dalam fungsi () untuk menerima "objek peristiwa" lalu lakukan e.preventDefault (). Ini juga alasan mengapa Anda bisa mengubah "e" menjadi kata-kata yang tidak dipesan oleh js.

Ini adalah referensi ke objek acara saat ini

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

Mengacu pada kode di atas
$(this)adalah elemen yang merupakan variabel.
clickadalah acara yang perlu dilakukan.
parameter esecara otomatis diteruskan dari js ke fungsi Anda yang menyimpan nilai $(this)nilai dan dapat digunakan lebih lanjut dalam kode Anda untuk melakukan beberapa operasi.