Що в JavaScript / jQuery що означає (e)?

Я новачок у JavaScript / jQuery, і я навчився створювати функції. Багато функцій відображено в дужках (e). Дозвольте мені показати, що я маю на увазі:

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

Завжди здається, що функція навіть не використовує значення (e), то чому вона там так часто?

e- це коротка посилання var для eventоб'єкта, яка буде передана обробникам подій.

Об'єкт події, по суті, має багато цікавих методів та властивостей, які можна використовувати в обробниках подій.

У прикладі, який ви опублікували, є обробник клацань, який є MouseEvent

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

DEMO - Події миші DEMO використовуєe.whichіe.type

Деякі корисні посилання:

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

ВІДПОВІДАЛЬНІСТЬ: Це дуже пізня відповідь на цей конкретний пост, але, коли я читав різні відповіді на це питання, мені вразило, що більшість відповідей використовують термінологію, яку можуть зрозуміти лише досвідчені кодери. Ця відповідь - це спроба вирішити оригінальне запитання для початківців аудиторії.

Вступ

Маленька річ " (e) " насправді є частиною ширшого обсягу чогось у Javascript, який називається функцією обробки подій. Кожна функція обробки подій отримує об'єкт події. Для цього обговорення розгляньте об'єкт як "річ", що містить купу властивостей ( змінних ) та методів ( функцій ), подібно до об'єктів на інших мовах. Ручка, ' e ' всередині маленької (e) речі, - це як змінна, яка дозволяє взаємодіяти з об'єктом (і я терміново використовую термін змінну ДУЖЕ).

Розглянемо такі приклади jQuery:

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

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

Пояснення

• "#someLink" - це ваш селектор елемента (який тег HTML ініціює це).
• "click" - це подія (при натисканні на вибраний елемент).
• "function (e)" - це функція обробки подій (при події створюється об'єкт).
• "e" - обробник об'єктів (об'єкт робиться доступним).
• "prevenDefault ()" - це метод (функція), що надається об'єктом.

Що відбувається?
Коли користувач натискає на елемент за допомогою ідентифікатора "#someLink" (можливо, тег прив’язки), викликайте анонімну функцію "функція (e)" та призначте отриманий об'єкт оброблювачу "e" . Тепер візьміть цей обробник і викличте один із його методів, "e.preventDefault ()" , який повинен заважати браузеру виконувати дію за замовчуванням для цього елемента.

Примітка: Дескриптор можна в значній мірі назвати як завгодно (тобто ' функція (billybob) '). "E" означає "подія", що здається досить стандартним для цього типу функцій.

Хоча 'e.preventDefault ()' є, мабуть, найпоширенішим використанням обробника подій, сам об'єкт містить багато властивостей і методів, до яких можна отримати доступ через обробник подій.

Деяку справді хорошу інформацію з цієї теми можна знайти на навчальному сайті jQuery, http://learn.jquery.com . Зверніть особливу увагу на розділи Використання jQuery Core та події .

eне має особливого значення. Це просто умова використовувати eяк ім'я параметра параметра, коли параметр є event.

Це може бути

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

також.

У цьому прикладі eє лише параметром для цієї функції, але це eventоб'єкт, який передається через неї.

eАргумент короткий для об'єкта події. Наприклад, ви можете створити код для якорів, які скасовують дію за замовчуванням. Для цього ви повинні написати щось на зразок:

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

Це означає, що при <a>натисканні на тег запобігає дії за замовчуванням події кліку.

Хоча ви можете бачити його часто, це не те, що ви повинні використовувати в межах функції, навіть якщо ви вказали це як аргумент.

У eскороченні jQuery для eventпоточного об'єкта події. Зазвичай він передається як параметр для запуску функції події.

Демонстрація: Події jQuery

У демонстрації я використовував e

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

Я, можливо, також використовував event

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

Однакові речі!

Програмісти лінуються, ми використовуємо багато скорочень, частково це зменшує нашу роботу, частково допомагає з читабельністю. Розуміння, що допоможе вам зрозуміти менталітет написання коду.

Сьогодні я щойно написав пост про "Чому ми використовуємо букви типу" e "в e.preventDefault ()?" і я думаю, що моя відповідь матиме певний сенс ...

Спочатку давайте побачимо синтаксис addEventListener

Зазвичай це буде: target.addEventListener (тип, слухач [, useCapture]);

А визначенням параметрів addEventlistener є:

type： Рядок, що представляє тип події, який потрібно слухати.

слухач : Об'єкт, який отримує сповіщення (об’єкт, що реалізує інтерфейс події), коли відбувається подія вказаного типу. Це повинен бути об'єкт, що реалізує інтерфейс EventListener, або функцію JavaScript.

(Від MDN)

Але я думаю, що є одне, що слід зауважити: Коли ви використовуєте функцію Javascript в якості слухача, об’єкт, який реалізує інтерфейс Event (об'єкт подія), буде автоматично призначений "першому параметру" функції. Отже, якщо ви використовуєте функція (e), об'єкт буде присвоєний "e", оскільки "e" є єдиним параметром функції (безумовно, першим!), тоді ви можете використовувати e.preventDefault, щоб щось запобігти ....

спробуємо на прикладі, як показано нижче:

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

результатом буде: [object MouseEvent] 5, і ви запобіжете події клацання.

але якщо ви видалите знак коментаря, наприклад:

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

ви отримаєте: 8 і помилку : "Uncaught TypeError: e.preventDefault не є функцією в HTMLInputElement. (VM409: 69)".

Звичайно, цього разу подія натискання не буде запобігатись, оскільки "e" було знову визначено у функції.

Однак якщо ви зміните код на:

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

кожна річ справно працюватиме знову ... ви отримаєте 8, і подія клацання буде запобіжена ...

Отже, "e" - це лише параметр вашої функції, і вам потрібно "e" у вашій функції (), щоб отримати "об'єкт події", а потім виконайте e.preventDefault (). Це також причина, чому ви можете змінити "e" на будь-які слова, які не зарезервовані js.

Це посилання на поточний об’єкт події

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

Посилаючись на вищевказаний код,
$(this)це елемент, який є якоюсь змінною.
click- це подія, яку потрібно виконати.
параметр eавтоматично передається з js у вашу функцію, яка містить значення $(this)значення, і може бути використана далі у вашому коді для виконання якоїсь операції.