1
00:00:00,210 --> 00:00:01,440
OK 우리는 되돌아 올 것이다.

2
00:00:01,470 --> 00:00:03,590
그래서 우리는 제가 이야기하고자하는 방법이 하나 더 적습니다.

3
00:00:03,740 --> 00:00:09,160
J 코리아 이벤트의 소개 비디오에서 언급했듯이 on 방법은 우리가 사용할 것입니다.

4
00:00:09,200 --> 00:00:13,980
시간의 90 %는 가장 많이 사용되는 Jay queery 이벤트 방식입니다.

5
00:00:14,280 --> 00:00:14,490
승인.

6
00:00:14,490 --> 00:00:18,580
그래서 그것이 작동하는 방법에 대해 이야기하자. 바닐라와 매우 비슷하다.

7
00:00:18,620 --> 00:00:20,790
예, 이벤트 리스너입니다.

8
00:00:20,790 --> 00:00:22,270
분명히 훨씬 짧아.

9
00:00:22,290 --> 00:00:29,590
그것은 단지 두 개의 문자 일 뿐이지 만 우리가 듣고 자하는 이벤트의 이름을 제공하는 것과 비슷한 방식으로 동작합니다.

10
00:00:29,760 --> 00:00:58,760
따라서 클릭 또는 키 누르기와 달리 이벤트의 한 유형에서만 실행됩니다. 클릭 또는 키 누르기를 사용하면 여기에서 수행하는 것처럼 클릭을 수행하는지 또는 클릭을 통해 제출할지 또는 두 번 클릭하는지 여부를 지정할 수 있습니다 여기에 더블 클릭 또는 드래그 시작 또는 키 누름 버튼이있어 마치 클릭 및 키 누름과 다른 모든 방법으로 이미 본 모든 것들을 대신 할 수 있습니다.

11
00:00:58,870 --> 00:01:06,670
스크롤과 제출을 좋아하는 톤이 있으며 키를 누르는 키를 누르기 만하면됩니다.

12
00:01:06,780 --> 00:01:10,410
이 모든 것은 on 메서드를 사용하여 수행 할 수 있습니다.

13
00:01:10,410 --> 00:01:15,480
그것은 우리가 달러 기호로 무엇인가를 먼저 선택할 필요가있을 때와 거의 같은 방식으로 작동합니다.

14
00:01:15,870 --> 00:01:17,450
여기에 예제를 보여 드리겠습니다.

15
00:01:17,730 --> 00:01:28,500
우리는이 경우 뭔가를 데이터 표의 아이디어로 몸 안의 모든 선생님을 선택하고 그런 다음 그것을 실행 한 다음 이벤트의 유형을 선택합니다.

16
00:01:28,500 --> 00:01:33,740
따라서 이것은 콜백 기능 만 수행하는 클릭 및 키 누르기와 비교하여 새로운 기능입니다.

17
00:01:33,840 --> 00:01:36,560
우리는 어떤 이벤트를 듣고 있는지 지정해야합니다.

18
00:01:36,750 --> 00:01:40,810
따라서이 경우를 클릭하고 콜백 함수를 쉼표로 사용하십시오.

19
00:01:40,830 --> 00:01:42,550
우리는 달리고 싶다.

20
00:01:42,660 --> 00:01:45,930
그럼 내 페이지를 새로 고침 해 봅시다.

21
00:01:45,930 --> 00:01:47,100
내 AJ가 데모를 채취했습니다.

22
00:01:47,130 --> 00:01:51,390
따라서 클릭 리스너가 없으므로 클릭이 발생하지 않으므로 키 누르기가 없습니다.

23
00:01:51,390 --> 00:01:53,350
우리 단추에도 아무 일도 일어나지 않습니다.

24
00:01:53,760 --> 00:01:57,600
빨리 가벼운 청취자를 추가해 보도록하겠습니다.

25
00:01:57,630 --> 00:02:00,660
H-1을 클릭 할 때 색을 바꾸자.

26
00:02:00,720 --> 00:02:13,570
그래서 우리는 각각을 선택해야합니다. 그리고 나서 첫 번째 인수에서 할 일은 빠른 이벤트 유형과 콜백 함수입니다.

27
00:02:13,950 --> 00:02:31,260
그리고 콜백 함수 내부에서 H-1의 색상을 변경하고자한다면 H-1과 같이 우리가 Color Purple이라고 말하면서 왜 이것이 문제가 될 수 있는지 생각할 수 있는지를 알 수 있습니다.

28
00:02:31,320 --> 00:02:44,700
그래서 엔터를 치면 퍼플로 바뀌지 만이 코드를 복사하고 페이지를 새로 고쳐서 다른 H-1 세 개를 추가하고 저장하겠습니다.

29
00:02:44,790 --> 00:02:46,340
이제 세 개의 H-1이 있습니다.

30
00:02:46,770 --> 00:02:55,160
그리고이 코드를 다시 실행하면 H-1을 클릭하면 모든 h가 보라색으로 바뀝니다.

31
00:02:55,200 --> 00:02:57,060
그래서 나는 그것을 시도 할 것이다.

32
00:02:57,090 --> 00:03:04,670
그들은 모두 자주색으로 변합니다. 아마도 우리가 원하는 기능이지만 아마도 우리가 클릭 한 항목에 영향을 미치기를 원할 것입니다.

33
00:03:04,950 --> 00:03:14,790
따라서 새로 고침을하기 위해 this 키워드를 사용해야하며이를 위해 J 쿼리 래퍼가 필요하다는 것을 기억하십시오.

34
00:03:14,790 --> 00:03:22,160
그래서 달러 기호는 이것을 괄호로 묶었고, 그것은 하나의 H-1이나 클릭 한 것을 가리 킵니다.

35
00:03:22,180 --> 00:03:28,400
그리고 지금 내가 엔터를 누르면 올바른 H-1 변경 사항 만 보라색으로 바뀝니다.

36
00:03:29,040 --> 00:03:31,770
좋아요, 그렇게해서 우리가 클릭을 할 수있는 방법입니다.

37
00:03:31,770 --> 00:03:34,150
이제 키를 누르는 방법을 사용하는 방법을 살펴 보겠습니다.

38
00:03:34,290 --> 00:03:51,740
그래서 우리는 그 점과 같은 입력을 선택한 다음 키 누름을 추가하고 두 번째 인수는 콜백 함수이며 우리는 간단한 conses 로그 만 할 것입니다.

39
00:03:51,870 --> 00:03:59,170
그러니 그냥 누를 로그 키를 취소하면 Enter 키를 누르게됩니다.

40
00:03:59,200 --> 00:04:06,540
이제 여기에 키를 입력하면 키를 입력 할 때마다 누를 수 있습니다.

41
00:04:06,540 --> 00:04:09,740
한 가지 더 많은 유형의 이벤트를 시도해 보겠습니다.

42
00:04:10,080 --> 00:04:12,190
우리가 버튼 위로 마우스를 가져 가면 뭔가를 해보 죠.

43
00:04:12,390 --> 00:04:15,770
마우스를 올리면 글꼴이 굵게 변경됩니다.

44
00:04:15,840 --> 00:04:21,670
그래서 우리는 먼저 모든 버튼을 선택하고 우리의 버튼을 추가해야합니다.

45
00:04:21,880 --> 00:04:24,730
그리고 우리가 사용할 이벤트를 마우스 입력이라고합니다.

46
00:04:24,930 --> 00:04:25,860
그냥 그렇게.

47
00:04:26,280 --> 00:04:31,280
그리고 마우스가 들어가면 로깅을 취소하는 것으로 시작합니다.

48
00:04:31,290 --> 00:04:38,240
그래서 우리는 내장 로그 마우스를 그렇게 할 것입니다.

49
00:04:38,610 --> 00:04:44,090
그리고 지금 내가 맴돌면 마우스가 그처럼 들어가게됩니다.

50
00:04:44,340 --> 00:04:46,420
그리고 우리가 처음 요소를 입력 할 때만입니다.

51
00:04:46,680 --> 00:04:50,300
그래서 내가 떠나서 돌아올 때까지 계속 반복해서 방아쇠를 당길 수는 없습니다.

52
00:04:50,750 --> 00:04:51,060
승인.

53
00:04:51,060 --> 00:04:55,450
그래서 우리가 마우스를 입력하면 우리는 끊임없이 기록하기를 원하지 않습니다.

54
00:04:55,470 --> 00:05:04,140
우리는 이것을위한 J 래퍼를 선택하고 글꼴 무게를 변경하기 위해 SS를 너무 과감하게 할 것입니다.

55
00:05:04,350 --> 00:05:13,020
그렇게 재미있는 방법과 우리는 그 같은 접기를하고 입력을 누르십시오.

56
00:05:13,020 --> 00:05:18,310
마우스를 가져 가면 대담한 것으로 바뀌는 것을보기가 어렵습니다.

57
00:05:18,390 --> 00:05:21,200
물론 그것은 계속해서 바뀌지 않는다는 대담한 채로 있습니다.

58
00:05:21,390 --> 00:05:32,040
그래서 우리는 다른 이벤트 인 마우스 놓기 버튼을 사용하여 똑같은 일을 한 다음, 폰트 무게로 바꾸지 않고 그 기능을 추가 할 수있었습니다.

59
00:05:32,040 --> 00:05:32,670
대담한.

60
00:05:32,670 --> 00:05:36,800
우리는 그것을 다시 정상으로 되돌릴 수 있습니다.

61
00:05:36,810 --> 00:05:40,420
이제 나가면 정상으로 돌아갑니다.

62
00:05:40,830 --> 00:05:43,530
그리고 내가 과감한 입장을하면 나는 정상적으로 떠난다.

63
00:05:43,950 --> 00:05:50,610
그래서 이것은 우리가 일종의 호버 선택 효과를 내기 위해 자바 스크립트로 뭔가를 할 수있는 방법입니다.

64
00:05:50,670 --> 00:05:57,490
그러나 이제는 CSSA를 사용하여 마우스를 가져 가면 가상 셀렉터를 사용하여 자바 스크립트를 사용하지 않고 쉽게 할 수 있습니다.

65
00:05:57,490 --> 00:06:00,510
그리고 그저 다른 사건이 있다는 것을 증명하기를 원했습니다.

66
00:06:00,720 --> 00:06:06,890
그래서 우리가 사용할 수있는 이벤트 리스너와 함께 사용할 수있는 모든 이벤트가 정말 유용합니다.

67
00:06:06,990 --> 00:06:09,500
내가 언급했듯이 우리는 항상 그것을 사용할 것입니다.

68
00:06:09,840 --> 00:06:14,690
그래서 제가 마지막으로 사용하고자하는 요점이 하나 있습니다. 예를 들어 제가 사용하려고하는 예가 있습니다.

69
00:06:14,690 --> 00:06:16,440
를 클릭하십시오.

70
00:06:16,440 --> 00:06:19,510
클릭하고 그들이 어떻게 약간 다른지 이야기하십시오.

71
00:06:19,800 --> 00:06:22,230
그래서 그들은 둘 다 일반적으로 당신을 위해 일할 것입니다.

72
00:06:22,230 --> 00:06:31,590
그들은 빠른 청취자를 추가 할 것입니다. 그러나 그 차이는 클릭당 그 당시에 페이지에있는 요소에 대한 클릭 청취자 만 추가된다는 것입니다.

73
00:06:32,040 --> 00:06:37,790
클릭 한 번으로 모든 미래 요소 또는 잠재적 인 미래 요소에 대한 청취자가 추가됩니다.

74
00:06:37,980 --> 00:06:40,430
따라서 이것이 할 일을 만들 때 의미가 있습니다.

75
00:06:40,530 --> 00:06:52,190
그러나 기본적으로 우리는 클릭보다는 클릭을 사용해야합니다. 왜냐하면 페이지가 사용자 입력을 입력하고 입력 할 때 거기에없는 페이지에 페이지를 추가해야하기 때문입니다.

76
00:06:52,260 --> 00:06:57,090
그렇게하면 새로운 일이 생길 것이며 새로운 사람들이 자신의 클릭 리스너를 갖기를 바랍니다.

77
00:06:57,090 --> 00:07:01,930
따라서 우리는 실제로 다시 사용할 필요가 있습니다. 실제로 목록을 만들기 시작할 때 더 의미가 있습니다.