jQuery_jquery의 on() 메소드 사용 예

이 기사의 예에서는 jQuery의 on() 메소드 사용법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 분석은 다음과 같습니다.

이 메소드는 하나 이상의 이벤트 핸들러를 일치하는 요소에 바인딩할 수 있습니다.
on() 메서드에 바인딩된 이벤트를 삭제하려면 off() 메서드를 사용합니다.

문법 구조 1:

코드 복사 코드는 다음과 같습니다.

$(selector).on(events,[selector] ,[데이터 ],fn)

매개변수 목록:

매개변수	설명
이벤트	공백으로 구분된 하나 이상의 이벤트 유형 및 선택적 네임스페이스입니다.
선택기	선택사항. 하위 요소가 핸들러를 호출할 선택된 요소를 필터링하는 선택기 문자열입니다. 선택 항목이 비어 있거나 무시된 경우 선택한 요소에 도달하면 이벤트가 항상 시작됩니다.
데이터	선택사항. 이벤트 핸들러 함수에 의한 처리를 위해 event.data 속성의 값으로 이벤트 객체에 전달되는 추가 데이터 객체입니다.
fn	이 이벤트가 발생하면 실행되는 함수입니다. false 값은 false를 반환하는 함수의 약칭으로 사용될 수도 있습니다.

예제 코드:

예 1:

코드 복사 코드는 다음과 같습니다.

본문>


위 코드는 클릭 이벤트를 div에 바인딩합니다. div를 클릭하면 div에 새 텍스트 콘텐츠를 설정할 수 있습니다.

예 2:

코드 복사 코드는 다음과 같습니다.

본문>



위 코드는 두 개의 이벤트를 div에 바인딩합니다. div를 클릭하거나 div에서 마우스를 이동하면 div에 대한 새 텍스트 콘텐츠가 설정됩니다.

예 3:

코드 복사 코드는 다음과 같습니다.

본문>



위 코드는 data 매개변수를 사용하여 바인딩된 이벤트 처리 함수에 데이터를 전달합니다.

예 4:



코드 복사

코드는 다음과 같습니다.

대가족
본문>


문법합동:

复主代码 代码如下:

$(selector).on(object,[selector],[data ])

매개변수 목록:

参数	描述
object	一个用字符串表示的，一个或多个空格分隔的事件类型和可选的命名空间，值表示事件绑定的处理函数。
selector	可选。一个选择器字符串，用以过滤选定的元素，该选择器的后裔元素将调用处理程序。 如果选择是空或被忽略，当它到达选定的元素，事件总是触发。
data	可选。作为event.data属性值传递给事件对象的额外数据对象以供事件处理函数处理。

예제 코드:

코드 복사 코드는 다음과 같습니다.

본문>



위 코드에서는 이벤트 유형과 이벤트 처리 기능이 객체 형태로 바인딩되어 있습니다.

이 기사가 모든 사람의 jQuery 프로그래밍에 도움이 되기를 바랍니다.