1
00:00:00,410 --> 00:00:05,580
Deze video ga ik op te pikken waar we gebleven en blijven praten over die drie Jay queery evenementen.

2
00:00:05,580 --> 00:00:31,020
Dus de volgende die ik wil introduceren heet Keep druk dus druk op de knop is een van de manieren Jay Cory dat we een toetsaanslag luisteraar kan toevoegen aan elementen, zodat ik je in de haven zal je laten zien hier als we naar beneden naar de event sectie en we kijken naar de toets ingedrukt en druk op een toets en de belangrijkste-up van deze drie verschillende gebeurtenissen die worden geactiveerd wanneer een type gebruiker iets op het toetsenbord en de verschillen zijn een beetje genuanceerd.

3
00:00:31,140 --> 00:00:43,180
Dus toets ingedrukt wordt afgevuurd elke keer dat we een toets indrukt en het is ontslagen vlak nadat we druk het naar beneden en dan omhoog in brand wordt gestoken wanneer we de sleutel loslaten en dan druk op de toets is een beetje anders.

4
00:00:43,230 --> 00:00:51,390
Sommige mensen zullen je vertellen dat toetsdruk wordt geactiveerd wanneer je naar beneden op een toets drukt en vervolgens los te laten, zodat het op en neer vertegenwoordigt de volledige druk op de toets.

5
00:00:51,390 --> 00:00:52,890
En dat is niet waar.

6
00:00:52,890 --> 00:00:55,790
Het vuurt eigenlijk in tussen beneden en bijbenen.

7
00:00:55,800 --> 00:00:57,450
Meestal niet altijd.

8
00:00:57,450 --> 00:00:59,520
Dus hebben we een grote stack overflow bericht.

9
00:00:59,670 --> 00:01:01,580
Dus ik raad dat je leest.

10
00:01:02,160 --> 00:01:12,370
Ik wil erop wijzen dit kleine stukje hier zo sleutel naar beneden en omhoog te voorzien van een code die aangeeft welke toets wordt ingedrukt terwijl de druk op de toets geeft aan welk karakter is ingevoerd.

11
00:01:12,810 --> 00:01:42,860
Dus een goed voorbeeld hiervan is dat als ik een tekstinvoer en iemand types verschuiven en dan een en ze proberen om een ​​hoofdletter een toets ingedrukt te maken en omhoog zal het vuur op de shift-toets en de kleine letter een VS-toets pers zal het vuur op een hoofdletter een dus het eigenlijk geeft me het karakter niet alleen dat de sleutel is die werden gedrukt en in welke volgorde, maar het werkelijke eindresultaat karakter wanneer we gebruik maken van een speciale toets zoals verschuiving aan het eind van de dag de drie verschillende gebeurtenissen zijn zeer vergelijkbaar.

12
00:01:42,930 --> 00:01:54,730
En de meeste van de tijd dat je weg kan komen met het gebruik van een van hen en ik ga Shoki druk alleen omdat het de meest voorkomende dus druk op de toets werkt net als op de plaats waar we iets met dollarteken te selecteren.

13
00:01:54,750 --> 00:01:57,600
Dus hier is een voorbeeld dat iets met dollarteken selecteert.

14
00:01:57,600 --> 00:02:10,100
En dan veranderen we op de belangrijkste pers en we passeren een callback functie en dat callback functie zal elk moment indrukken van een toets gebeurtenis wordt geactiveerd op het geselecteerde element of verzameling van elementen worden genoemd.

15
00:02:10,110 --> 00:02:19,750
Dus ik ga om aan te tonen dat nu zal ik terug naar mijn HMO en laten we toe te voegen in een input type is gelijk aan de tekst, net als dat.

16
00:02:20,250 --> 00:02:23,660
En we zullen het daarbij laten en te vernieuwen onze pagina.

17
00:02:24,340 --> 00:02:26,090
OK dus nu hebben we een ingang hier.

18
00:02:26,550 --> 00:02:31,900
En laten we wat code die gewoon annuleren dat inloggen elke keer dat een toets wordt hier gedrukt.

19
00:02:32,190 --> 00:02:39,800
Dus het openstellen van de console en we moeten eerst de ingang te selecteren zodat we net inputs als dat kan doen.

20
00:02:40,380 --> 00:02:42,800
En dat is niet erg specifiek in dit geval.

21
00:02:42,810 --> 00:02:44,790
Er is slechts één ingang dus dat is prima.

22
00:02:44,910 --> 00:02:54,740
Maar als we hadden checkboxes en als we hadden kleur ingangen en radio knoppen zouden we willen opgeven alleen wanneer het type gelijk is aan de tekst is.

23
00:02:55,290 --> 00:02:57,370
Maar voor nu ingang is prima.

24
00:02:57,390 --> 00:03:03,280
Zorg ervoor dat we het goed dat selecteert het dan voegen we die toets drukt, net als dat.

25
00:03:03,660 --> 00:03:11,480
En dan de binnenkant van hier voegen we een callback functie die elke keer dat een toets wordt ingedrukt zal worden genoemd.

26
00:03:11,490 --> 00:03:21,220
Dus in dit geval laten we hebben het annuleren het logboek dat u een toets hebt ingedrukt en druk op enter.

27
00:03:21,840 --> 00:03:24,470
En nu als ik ga hier en ik typ een sleutel.

28
00:03:24,510 --> 00:03:26,530
Dus ik ben het raken van de letter P op dit moment.

29
00:03:26,910 --> 00:03:33,060
U kunt zien dat ik u op om de belangrijkste en als ik een andere toets typ Alles wat het doet is mij een aantal hier.

30
00:03:33,060 --> 00:03:34,770
Dat is gewoon hoe Chrome doet.

31
00:03:34,770 --> 00:03:38,480
Maar ik krijg een ander concept logboek als ik typ voor elk karakter.

32
00:03:38,820 --> 00:03:46,630
Dus dat is hoe we dat log karakter iets dat we vaak willen doen is wat code, afhankelijk van welk personage werd ingedrukt run kon annuleren.

33
00:03:46,650 --> 00:04:01,520
We zullen het maken van een lijst te app met Jay Querrey waar u kunt typen in een nieuw te doen zoals Walk the dog en druk op enter en dat zal vervolgens die tekst hier en maak een nieuwe te doen en wis de ingang zodat je doet hoeft niet te klikken op een knop, zoals in te dienen.

34
00:04:01,560 --> 00:04:02,900
Je slaat gewoon de enter-toets.

35
00:04:03,180 --> 00:04:09,110
Dus wat we willen doen is luisteren indrukken van een toets, maar alleen iets doen als de gebruiker op te voeren.

36
00:04:09,270 --> 00:04:12,760
Om dat te doen dat we eigenlijk nodig hebben om onze code een beetje aanpassen.

37
00:04:12,840 --> 00:04:18,640
Dus ik ga dit gewoon kopiëren en ik zal de pagina te vernieuwen en plak deze opnieuw in.

38
00:04:18,660 --> 00:04:23,430
Dus we nog steeds luisteren naar de toets drukken, maar we gaan aan de slag met het evenement object.

39
00:04:23,440 --> 00:04:31,890
Ik ga een argument hier toevoegen Ik noem het evenement en dit object zal gewoon alle informatie over de belangrijkste persevenement bevatten.

40
00:04:31,890 --> 00:04:37,260
Dus ik ga gewoon dat logboekgebeurtenis annuleren, zodat je dat kunt zien en ik druk op enter.

41
00:04:37,260 --> 00:04:45,200
En nu als ik typ je kunt zien dat ik voortdurend in te loggen evenement elke keer en deze gebeurtenis vertelt me ​​dat type is druk op de toets.

42
00:04:45,210 --> 00:04:49,250
Het geeft me een tijdstempel geeft me een paar andere dingen.

43
00:04:49,350 --> 00:04:53,360
Een van de belangrijkste onderdelen is dit char code 106.

44
00:04:53,490 --> 00:04:56,910
Ook is er key code 1 of 6 en er is.

45
00:04:56,910 --> 00:05:00,340
Welke zijn hier en ze wijzen allemaal op een of zes.

46
00:05:00,360 --> 00:05:02,870
Er zijn enkele kleine verschillen die ik niet in zal gaan.

47
00:05:03,090 --> 00:05:07,840
We gaan gewoon vasthouden waarmee dat is degene die de J Querrey docs gebruiken officieel als goed.

48
00:05:07,980 --> 00:05:11,860
Wat dit betreft is de code van de ingedrukte toets.

49
00:05:11,910 --> 00:05:18,540
Dus elke sleutel heeft een eigen code en het kan u hier laten zien de javascript tekencodes.

50
00:05:18,760 --> 00:05:21,900
Er is een pagina hier dat je interactief zal tonen.

51
00:05:21,900 --> 00:05:27,480
Dus als ik typ ik wil weten wat de letter zie de bijbehorende code.

52
00:05:27,480 --> 00:05:33,910
Op 67 als ik wil om te controleren wat in te voeren is dat ik nodig om de enter toets die ik nu zal doen slaan.

53
00:05:34,180 --> 00:05:36,570
En het vertelt me ​​key code er aan het eind.

54
00:05:36,870 --> 00:05:42,860
Dus dat is een van de enigen die ik ken uit mijn hoofd, want we doen dit een stuk waar we willen dat er iets gebeurt als je druk op de Enter-toets.

55
00:05:43,200 --> 00:05:43,440
OK.

56
00:05:43,440 --> 00:05:45,390
Dus laten we niet vergeten dat de belangrijkste code 13.

57
00:05:45,660 --> 00:05:54,740
Ga terug naar onze code hier en alles wat we willen doen is schrijven een if-statement in plaats van onze luisteraar die zegt dat als de gebruiker druk op enter.

58
00:05:54,750 --> 00:06:18,250
Dus als een evenement dat gelijk is aan 13 is, dat betekent dat de gebruiker druk op enter en we zullen gewoon waarschuwen u druk op enter net als dat en zich te ontdoen van deze nu vanwege dat logboek.

59
00:06:18,870 --> 00:06:23,160
Dus een gebruiker enige vorm van druk op de knop in plaats van deze ingang.

60
00:06:23,400 --> 00:06:29,490
Dan hebben we dit evenement object dat we nu toegevoegd aan onze callback die al was het werd doorgegeven.

61
00:06:29,520 --> 00:06:32,880
Zelfs als we vertrokken dit uit, maar we kregen het niet vastleggen in een variabele.

62
00:06:33,030 --> 00:06:36,160
Dus nu zijn we vastleggen in een variabele met de naam event.

63
00:06:36,210 --> 00:06:39,870
Je ziet ook deze zogenaamde E soms maar dat kan van alles worden genoemd.

64
00:06:39,870 --> 00:06:41,580
Vergeet niet het is helemaal aan jou.

65
00:06:41,700 --> 00:06:48,150
En dan zijn we controleren of het die eigendom is 13, dat is de enter toets tekencode.

66
00:06:48,150 --> 00:06:49,360
Druk op enter.

67
00:06:50,040 --> 00:06:55,830
En laten we nu gaan over deze en we zullen tik wat niet in te voeren sleutels en we niet deze signaleringen krijgen.

68
00:06:55,860 --> 00:07:01,130
We krijgen de consul uit logboeken, omdat we het opzetten van de oorspronkelijke luisteraar hier.

69
00:07:01,980 --> 00:07:05,740
Maar nu ben ik verwijder ik dat alles en ik zal een aantal dingen typt en dan zal ik op enter.

70
00:07:06,240 --> 00:07:08,160
En nu ik je op enter.

71
00:07:08,190 --> 00:07:11,960
Dus elke keer als ik typ in te voeren dus ik zal het nu doen.

72
00:07:12,300 --> 00:07:13,900
Het vertelt me ​​dat je druk op enter.

73
00:07:14,190 --> 00:07:14,670
Okee.

74
00:07:14,760 --> 00:07:20,390
Dus dat is alles wat ik wil laten zien over de belangrijkste pers zal worden met behulp van deze te maken of om de lijst te doen in slechts een paar video's van nu.