Latest web development tutorials

jQuery를 이벤트

jQuery를 특별히 이벤트 핸들러를 위해 설계되었습니다.


이벤트는 무엇입니까?

다른 방문자 페이지로 응답 이벤트를했다.

이벤트 핸들러 메소드는 특정 이벤트가 HTML을 발생할 때 호출 할 때 것을 의미한다.

예 :

  • 요소 위로 마우스를 이동합니다.
  • 라디오 버튼을 선택
  • 요소를 클릭

이 용어는 종종 이벤트 "트리거"에 사용되는 (또는 "여기"), 예를 들면 : "트리거 키 누르기 이벤트가 키를 누를 때."

공통 DOM 이벤트 :

鼠标事件 键盘事件 表单事件 文档/窗口事件
click keypress submit load
dblclick keydown change resize
mouseenter keyup focus scroll
mouseleave blur unload  


jQuery를 이벤트 메서드 구문

jQuery를, 대부분의 DOM 이벤트는 jQuery를 법의 동등한 있습니다.

페이지, 클릭 이벤트를 지정합니다

. $ ( "P") 클릭 ();

다음 단계는 언제 트리거 이벤트를 정의하는 것이다. 사용자는 이벤트 함수를 구현할 수있다 :

$ ( "P"). () {(기능을 클릭
코드! // 작업이 트리거 된 후
});


일반적으로 사용되는 jQuery를 이벤트 방법

$ (문서) .ready ()

$ (문서) .ready () 메소드는 우리가 완전히 기능 실행 후 문서를로드 할 수 있습니다. 의 이벤트 방법 jQuery를 구문 부분은 언급하고있다.

()을 클릭합니다

트리거 버튼 클릭 이벤트가 함수를 호출 할 때 () 메소드를 클릭합니다.

사용자가 HTML 요소를 클릭 할 때이 기능이 실행됩니다.

다음 예에서, 때 현재 <P> 요소를 숨기기 위해 이벤트 트리거 <P> 요소를 클릭 :

$("p").click(function(){
$(this).hide();
});

»시도

dblclick ()

당신이 요소를 두 번 클릭하면 dblclick 이벤트가 발생합니다.

dblclick () 메서드 dblclick 트리거 이벤트 또는 이벤트가 dblclick 발생했을 때 실행하는 소정의 기능 :

$("p").dblclick(function(){
$(this).hide();
});

»시도

mouseenter ()

시 소자 걸쳐 마우스 포인터, mouseenter 이벤트가 발생한다.

mouseenter () 메서드 mouseenter 트리거 이벤트 또는 이벤트가 mouseenter를 발생할 때 실행하는 소정의 기능 :

$("#p1").mouseenter(function(){
alert("You entered p1!");
});

»시도

하는 MouseLeave ()

마우스 포인터가 요소를 떠날 때, 이벤트가 발생하는 MouseLeave.

하는 MouseLeave () 메서드하는 MouseLeave 트리거 이벤트 또는 이벤트가하는 MouseLeave 발생시 소정의 기능을 실행하기 때

$("#p1").mouseleave(function(){
alert("Bye! You now leave p1!");
});

»시도

에서 MouseDown ()

마우스 포인터가 요소와 마우스 버튼을 누르는 동안 이동하면에서 MouseDown 이벤트가 발생한다.

mouseDown 이벤트를 실행하는 발생시에서 MouseDown () 메서드는 지정된 MouseDown 이벤트 나 기능을 트리거 :

$("#p1").mousedown(function(){
alert("Mouse down over p1!");
});

»시도

에서 mouseUp ()

마우스 버튼 요소를 통해 출시되면에서 mouseUp 이벤트가 발생합니다.

이벤트에서 mouseUp 발생시에서 mouseUp () 메서드에서 mouseUp 트리거 이벤트, 또는 소정의 기능을 실행합니다 :

$("#p1").mouseup(function(){
alert("Mouse up over p1!");
});

»시도

() 가져

호버 () 메소드는 커서가 이벤트를 가리키면 시뮬레이션하는 데 사용됩니다.

요소에 대한 마우스 이동, 제 지정된 기능 (mouseenter)를 트리거 할 때, 요소의 해제 마우스 움직임, 그것은 제 지정된 기능 (하는 MouseLeave)를 트리거 할 때.

$("#p1").hover(function(){
alert("You entered p1!");
},
function(){
alert("Bye! You now leave p1!");
});

»시도

) (초점

요소가 포커스를 얻었을 때, 포커스 이벤트가 발생합니다.

마우스 탭 키를 대상으로 선택한 요소 또는 요소를 클릭하면 요소가 초점이 될 것입니다.

포커스 () 메소드는 포커스 이벤트 또는 이벤트 포커스 발생시 실행하기 위해 소정의 기능을 트리거 :

$("input").focus(function(){
$(this).css("background-color","#cccccc");
});

»시도

흐림 ()

요소가 포커스를 잃을 때, 흐림 이벤트가 발생합니다.

흐림 () 메서드는 소정의 이벤트가 흐림 효과를 발생할 때 실행 흐림 이벤트 나 기능을 트리거 :

$("input").blur(function(){
$(this).css("background-color","#ffffff");
});

»시도