jQuery 연구 노트 jQuery events_jquery

1. 이벤트 바인딩

1. 이벤트 바인딩 기능
이벤트 바인딩 기능은
.bind(type [,data]) , fn)
유형: 클릭 등의 유형.....
데이터: 매개변수
fn: 이벤트에 의해 실행되는 함수

예

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

$(function(){
$(#id1).click(function( ){
$ (#id2).show(); //id2는
}) ;
})

2.
1. 마우스 호버 이벤트 .hover(enter,leave)
enter: 마우스 커서가 객체로 이동할 때 발생하는 함수 leave: 마우스 커서가 객체 밖으로 이동할 때 발생하는 함수

예:

코드 복사 코드는 다음과 같습니다. $( function(){

$(#id1).hover(function(){

$(#id2).show();//id2 쇼
}, function(){
$( #id2).hide();//id2 hides
}) ;
})



2.toggle(fn1,fn2 ....,fnN)

fn: 처음으로 fn1을 실행하고, 두 번째로 fn2를 실행하려면 클릭하세요


 3. 이벤트 버블링

이벤트는 항상 내부 레이어에서 실행되며 가장 바깥쪽 레이어로 이동하여 해당 객체를 클릭하지 않으면 이 객체를 포함하는 객체에 바인딩된 모든 이벤트가 한 번 실행되는 것을 원하지 않습니다. jQuery는 이벤트 실행을 방지하기 위한 몇 가지 방법을 정의했습니다.
1. 이벤트 객체 얻기이벤트 객체를 얻는 방법은 이벤트 실행 함수에 매개변수를 추가하는 것입니다
$(#id1). click(function(even){});//even은 획득한 이벤트 객체2. 이벤트 버블링 방지
이벤트 실행 함수에 이러한 코드를 추가하여 이벤트 버블링을 방지할 수 있습니다
even.stopPropagation( );
3. 기본 이벤트 방지
브라우징 브라우저의 기본 이벤트는 버튼을 클릭한 후 제출, 링크를 클릭한 후 링크 열기 등을 의미합니다. jQuery는 이러한 기본 이벤트의 실행도 방지할 수 있습니다
even.preventDefault();


4. 이벤트 객체의 속성을 가져옵니다.

even.type();//다음과 같은 이벤트 유형을
가져옵니다. $(#id1).click(function(even){
alert(even .type); false 반환;
});//"클릭" 반환

even.target();//이벤트를 발생시킨 개체를 가져옵니다.

even.while(); 1=왼쪽, 2=가운데, 3=오른쪽

5. 이벤트 제거

.unbind(type [,data]);

예:


코드 복사

코드는 다음과 같습니다. $(function() { $(#id1).bind("click",fn1=function(){alert( "이벤트 1");})

.bind("click",fn2=function() {alert("이벤트 2");})

.bind("click",fn3= function(){alert("이벤트 3");});

$("#id2").click(function(){
$(#id1). unbind("click",fn2);//fn2의 클릭 이벤트 삭제
});



6. 기타 작업

1.
.bind(유형 [,data],fn).bind(유형 [,data],fn) ......

.bind(유형 유형..... [,data], fn) ;
2. 이벤트 네임스페이스 추가 .bind(type.namespace [,data] ,fn)
다음과 같이 네임스페이스만 지정하면 됩니다. .unbind(".namespace")