Преглед: DOM събития в jQuery

Добавяне на слушател за събитие

Можеш да добавиш слушател на събитие като използваш on():

    $("#save-button").on("click", function() {
       // прихващане на събитието клик
    });

Ако трябва да достъпиш детайли за събитието, можеш да ги намериш в обекта на jQuery събитието, който се подава на колбек функцията:

    $("#face-pic").on("click", function(event) {
       var mouseX = event.pageX;
       var mouseY = event.pageY;
    });

Предизвикване на събития

Можеш да предизвикаш ръчно събитие върху обект от JavaScript, като използваш:
$("#save-button").trigger("click");

Това може да е полезно, когато тестваш нова функционалност или искаш да изпълниш някакъв код, когато страницата се зареди и след определено събитие.

Проверка на готовност на DOM

Ако искаш да се увериш, че браузърът не изпълнява твоя JS код преди DOM-ът да се зареди напълно, можеш да подадеш кода си на ready():

    $(document).ready(function() {
      $("h1").text("Готови ли сте за това?");
    });

По-кратка версия на това е да подадеш кода си на jQuery функция:

    $(function() {
      $("h1").text("Готови ли сте за това?");
    });

Този код не е толкова четим, колкото по-дългата версия, затова препоръчваме да използваш функцията ready().

Забележи, че ако включиш своя JS чрез <script> таг в долната част на страницата, то твоят DOM трябва да е напълно готов до момента, в който браузърът стигне до зареждане на JS. Все пак ако искаш да се презастраховаш, можеш винаги да проверяваш дали DOM-ът е готов.

Още техники за събития

За по-дълго обобщение и по-дълбоко навлизане в събитията на jQuery, прочети jQuery Event Basics в документацията.

Искаш ли да се присъединиш към разговора?

Вписване в профила

Сортирай по:

Все още няма публикации.

Разбираш ли английски? Натисни тук, за да видиш още дискусии в английския сайт на Кан Академия.