Jak dowiedzieć się, które zdarzenia JavaScript są uruchamiane?

Mam listę wyboru: 

<select id="filter">
  <option value="Open" selected="selected">Open</option>
  <option value="Closed">Closed</option>
</select>

Po wybraniu Closed Strona się przeładowuje. W tym przypadku pokazuje zamknięte bilety(zamiast otwartych). Działa dobrze, gdy robię to ręcznie.

Problem polega na tym, że strona nie przeładowuje się po wybraniu Closedz Watir : 

browser.select_list(:id => "filter").select "Closed"

To zwykle oznacza, że niektóre zdarzenia JavaScript nie są wywoływane. Mogę odpalić zdarzenia z Watir: 

browser.select_list(:id => "filter").fire_event "onclick"
Ale muszę wiedzieć, które wydarzenie wystrzelić.

Czy jest sposób, aby dowiedzieć się, które wydarzenia są zdefiniowane dla elementu?

Author: Željko Filipin, 2010-09-24
Source

3 answers

Pomyślałem, że dodam, że można to zrobić również w Chrome:

Ctrl + Shift + I (Narzędzia programistyczne) > Źródła > punkty przerwania detektora zdarzeń (po prawej).

Możesz również wyświetlić wszystkie zdarzenia, które zostały już dołączone, klikając prawym przyciskiem myszy na elemencie, a następnie przeglądając jego właściwości (panel po prawej stronie).

Na przykład:

  • kliknij prawym przyciskiem myszy przycisk upvote po lewej stronie
  • Wybierz inspect element
  • Zwiń sekcję stylów (sekcja po prawej stronie - podwójny szewron)
  • rozwiń opcję słuchacze zdarzeń
  • teraz możesz zobaczyć Wydarzenia związane z upvote

    • Nie wiem, czy jest tak potężny, jak opcja firebug, ale wystarczył na większość moich rzeczy.

    Inną opcją, która jest nieco inna, ale zaskakująco niesamowita, jest Event wizualny: http://www.sprymedia.co.uk/article/Visual + Wydarzenie+2

    Podkreśla wszystkie elementy na stronie, które zostały powiązane i mają wyskakujące okienka pokazujące wywołane funkcje. Całkiem niezła jak na zakładkę! Jest też wtyczka Chrome, jeśli to bardziej Twoja sprawa - nie jestem pewien innych przeglądarek.

    AnonymousAndrew wskazał również monitorEvents(window); tutaj

     116
    Author: Chris,
    Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
    2017-05-23 12:18:24

    Wygląda na to, że Firebug (dodatek do Firefoksa) ma ODPOWIEDŹ:

    • open Firebug
    • Kliknij prawym przyciskiem myszy element w zakładce HTML
    • Kliknij Log Events
    • włącz kartę konsoli
    • Kliknij Persist na karcie Konsola (w przeciwnym razie karta konsoli zostanie wyczyszczona po ponownym załadowaniu strony)
    • select Closed (ręcznie)

    • Będzie coś takiego w zakładce konsola:

      ...
mousemove clientX=1097, clientY=292
popupshowing
mousedown clientX=1097, clientY=292
focus
mouseup clientX=1097, clientY=292
click clientX=1097, clientY=292
mousemove clientX=1096, clientY=293
...

    Source: Firebug Tip: Log Events

     112
    Author: Željko Filipin,
    Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
    2010-09-24 13:44:58

    Jeśli chodzi o Chrome, sprawdź monitorEvents () za pomocą interfejsu API wiersza poleceń.

    • otwórz konsolę za pomocą Menu > Narzędzia > konsola JavaScript.
    • Enter monitorEvents(window);

    • Wyświetlanie konsoli zalanej zdarzeniami 

      ...
mousemove MouseEvent {dataTransfer: ...}
mouseout MouseEvent {dataTransfer: ...}
mouseover MouseEvent {dataTransfer: ...}
change Event {clipboardData: ...}
...

    Istnieją inne przykłady w dokumentacji . Domyślam się, że ta funkcja została dodana po poprzedniej odpowiedzi.

     60
    Author: AnonymousAndrew,
    Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
    2013-11-05 16:18:08