Return to Video

03-07 Anatomy_of_a_jQuery_Event_Listener

  • 0:00 - 0:03
    지금까지 여러분은 브라우저 이벤트를 찾아보고
  • 0:03 - 0:05
    로그가 기록되는 걸 지켜봤습니다
  • 0:05 - 0:09
    이제는 jQuery로 이벤트를 감지하고
    반응해 볼 시간이네요
  • 0:09 - 0:13
    그것들을 감지하고 반응하기 위해 세 항목이 필요합니다
  • 0:13 - 0:17
    감지할 대상 요소, 반응할 이벤트,
  • 0:17 - 0:19
    그리고 반응으로 취할 행동이죠
  • 0:19 - 0:20
    예를 보여드릴게요
  • 0:22 - 0:25
    먼저 jQuery가 이벤트를 위해 감지할 대상 요소가 필요하죠
  • 0:26 - 0:29
    그래서 저는 jQuery로 인풋 필드를 선택할게요
  • 0:30 - 0:32
    그리고 .on() 메소드를 호출했어요
  • 0:32 - 0:34
    이 .on() 메소드가 바로 마법이 일어나는 부분이죠
  • 0:34 - 0:38
    jQuery가 이벤트 리스너를 설정하기 위해
    주로 쓰는 방법입니다
  • 0:39 - 0:42
    on 메소드의 첫 번째 값은
    제가 감지해내고 싶은 이벤트입니다
  • 0:42 - 0:44
    이 예시에서는 keypress죠
  • 0:44 - 0:48
    click이나 change 또는 mouseover 같은
    이름이 될 수도 있어요
  • 0:49 - 0:53
    마지막으로 반응으로서 취할 행동으로
    함수를 보내야 합니다
  • 0:53 - 0:55
    이 함수는 callback()이라고 불리죠
  • 0:55 - 0:58
    on() 메소드에 보내진 callback() 함수는
  • 0:58 - 1:00
    그냥 일반적인 자바스크립트 함수죠
  • 1:00 - 1:02
    그래서 여러분이 원하는
    아무 자바스크립트 코드나 모두 포함할 수 있어요
  • 1:02 - 1:06
    페이지 컨텐츠 변경 코드부터 분석 코드까지요
  • 1:06 - 1:09
    페이지 색을 바꾸기 위해서 함수 내용을 바꿔 볼게요
  • 1:10 - 1:11
    테스트 해보면
  • 1:11 - 1:14
    짠, 괜찮네요
  • 1:14 - 1:17
    다음 퀴즈에서는 여러분이 직접
    이벤트 리스너를 만들어 보겠습니다
Tytuł:
03-07 Anatomy_of_a_jQuery_Event_Listener
Opis:
more » « less
Video Language:
English
Team:
Udacity
Projekt:
ud245 - Intro to JQuery
Duration:
01:18

Korean subtitles

Revisions Compare revisions