Eftersom vi just pratade om händelser är det en bra tid att nämna anpassade händelser. Alla händelser som vi hittills har pratat om är så att säga ”riktiga” händelser. Händelser som har sitt ursprung i DOM baserat på riktiga saker som händer, som ett klick eller tangenttryckning. Dessa händelser kan "utlösas" artificiellt i jQuery. Till exempel, för att "fejka" ett klick på en knapp kan du göra:
$("#some-button").trigger("click");Då aktiveras alla klickhanterare som är bundna till den knappen som om en användare verkligen klickade på den knappen. Men vad händer om vi gjorde det:
$("#some-button").trigger("dance");Vad händer då? ”Dans” är inte en ”riktig” händelse. Men inget fel kommer att kastas. Det händer precis så att det antagligen inte finns några "dans" -hanterare bundna till den knappen. Men det kan finnas och det är i princip vad en anpassad händelse är. En händelse med ett namn som du bara gör.
Varför skulle du göra det? Mestadels organisatoriska skäl. Du kanske vill separera ditt JavaScript som hanterar händelser och åtgärder och ditt JavaScript som hanterar data och administrativa saker. Det är väldigt rimligt. Om den här knappen kanske var en "Spara inställningar" -knapp, kan du helt enkelt avfyra en anpassad händelse med namnet "spara-inställningar" och någon annanstans ha en hanterare som väntar på att den händelsen ska utlösas och sparar faktiskt data. Det är i huvudsak vad vi gjorde i exemplet från videon.
Ett annat användningsfall för anpassade händelser är att skapa generiska UI-komponenter. Jag pratar om det i det här blogginlägget.
Kanske skapar du en dragspeleffekt som en UI-komponent. Dragspel gör allt dragspel, öppnar och stänger paneler på klick / kranar. Din UI-komponent gör det väldigt snyggt. Nu kan en utvecklare som använder dragspel ha speciella och unika saker som de vill att ska hända med det. Anta att de använder dragspel för kontoinställningar, och när en användare stänger en panel vill de spara data från formulärelementen i den panelen. En traditionell modell kan vara att författaren till den dragspel UI-komponenten erbjuder återuppringningsfunktioner när den här åtgärden händer. När du initialiserar dragspel skickar du in återuppringningsfunktioner som du vill ringa när dessa saker händer. Det är en väg att gå ner. En annan väg skulle vara för dragspel att automatiskt avfyra anpassade händelser för alla relevanta åtgärder som det gör.När panelen stängs kan den avfyra enpanelClosedhändelse på dragspel elementet själv. Då kan utvecklare som arbetar med det bara binda till dessa händelser. Det är bara en annan väg du kan gå av organisationsskäl som kan vara ganska elegant.