jquery의 기본 이벤트 메소드는 무엇입니까?

기본 이벤트 방법: 1. click(), 마우스 클릭 이벤트 설정 2. dblclick(), 마우스 더블클릭 이벤트 설정 3.change(), 콘텐츠 변경 이벤트 설정; 트리거 포커스 이벤트 설정 5. Blur(), 포커스 손실 이벤트 설정 6. mousedown() 등

이 튜토리얼의 운영 환경: windows7 시스템, jquery1.10.2 버전, Dell G3 컴퓨터.

이벤트 메소드는 선택한 요소의 이벤트 핸들러에 함수를 트리거하거나 추가합니다.

아래 표에는 이벤트 처리를 위한 일부 jQuery 메서드가 나열되어 있습니다.

mouseout 이벤트 추가/트리거Add /trigger 마우스 오버 이벤트 mouseup()mouseup 이벤트 추가/트리거off()on() 메서드를 통해 추가된 이벤트 핸들러 제거on()요소에 이벤트 처리 추가 절차 one() 선택한 요소에 하나 이상의 이벤트 핸들러를 추가합니다. 이 핸들러는 요소당 한 번만 트리거될 수 있습니다. ready() DOM이 완전히 로드될 때 실행될 함수를 지정합니다. toggle() 버전 1.9에서 제거되었습니다. 클릭 이벤트 간 전환을 위해 두 개 이상의 함수 추가선택한 요소에 바인딩된 모든 이벤트 트리거triggerHandler()선택한 요소에 바인딩된 이벤트 트리거 지정된에 대한 모든 함수 이벤트 unbind()선택한 요소에서 추가된 이벤트 핸들러 제거 undelegate()현재 또는 미래에 선택된 요소에서 이벤트 핸들러 제거 프로그램

지침:

1. 위 이벤트 함수에는 세 가지 용도가 있습니다.

//直接绑定事件到元素上
$('.target1').keydown(function(e) {
    $("em:first").text(e.target.value)    //通过对象e获取输入的值
});
 
//传递参数调用函数处理
$("#test").click(11111,function(e) {
    //this指向 div元素
    //e.data  => 11111 通过e传递参数数据
});
 
//手动触发已绑定的点击事件
$elem.click()

2. mouseover와 mouseenter의 차이점: 마우스 포인터가 선택한 요소를 통과하든 하위 요소를 통과하든 상관없이 mouseover 이벤트는 지원 버블 처리라고 하는 버블링 처리는 하위 요소와 상위 요소가 공동으로 정의하는 이벤트를 의미합니다. 하위 요소가 트리거되거나 하위 요소가 정의되지 않으면 이벤트가 다음으로 전파됩니다. 상위 이벤트가 트리거되도록 합니다. mouseenter 이벤트는 마우스 포인터가 선택한 요소 위로 지나갈 때만 발생합니다.

3. 양식 요소에는 양식을 제출하는 기본 동작이 있습니다. 제출을 통해 처리되는 경우 브라우저의 이 기본 동작을 비활성화해야 합니다. 전통적인 방법은 이벤트 객체 e.preventDefault()를 호출하여 이를 처리하는 것입니다. jQuery에서는 함수 끝에서 직접 false를 반환할 수 있습니다.

    //回车键或者点击提交表单后禁止浏览器默认跳转：
    $('#target2').submit(function() {
        alert('捕获提交表达动作,阻止页面跳转')
        return false;
    });

4. on()을 사용하세요

기본 사용법: .on(events,[selector],[data])

가장 일반적인 방법은 클릭 이벤트를 요소에 바인딩하는 것입니다. 및 on 메소드

$("#elem").click(function(){})  //快捷方式
$("#elem").on('click',function(){}) //on方式

//多个事件绑定同一个函数，通过空格分离，传递不同的事件名，可以同时绑定多个事件
$("#elem").on("mouseover mouseout",function(){ });

//多个事件绑定不同函数
$("#elem").on({
    mouseover:function(){}, 
    mouseout:function(){}
});

//将数据传递到处理程序
$( "button" ).on( "click", {    //第二个参数传递数据给函数调用
  name: "Mr.Tory"
}, greet );
function greet( event ) {
  alert( "Hello " + event.data.name ); //输出Hello Mr.Tory
}

이벤트 객체의 속성 및 메소드

메서드	Description
bind()	요소에 이벤트 핸들러 추가
blur()	초점 상실 이벤트 추가/트리거
change()	추가/트리거 이벤트 변경
click()	클릭 이벤트 추가/트리거
dblclick()	더블 클릭 이벤트 추가/트리거
die()	버전 1.9에서 제거되었습니다. live() 메소드를 통해 추가된 모든 이벤트 핸들러 제거
focus()	포커스 이벤트 추가/트리거
focusin()	focusin 이벤트에 이벤트 핸들러 추가
focusout( )	Add 포커스 아웃 이벤트에 대한 이벤트 핸들러
hover()	호버 이벤트에 두 개의 이벤트 핸들러 추가
keydown()	키 다운 이벤트 추가/트리거
keypress()	키 누르기 이벤트 추가/트리거
keyup()	키업 이벤트 추가/트리거
live()	버전 1.9에서 제거되었습니다. 현재 또는 향후 선택된 요소에 하나 이상의 이벤트 핸들러를 추가합니다
mousedown()	mousedown 이벤트 추가/트리거
mouseenter()	mouseenter 이벤트 추가/트리거
mouseleave( )	mousemove 이벤트 추가/트리거
mousemove()	mouseout()
	mouseover()
	trigger()

문서 기준 왼쪽/마우스 위치는 위쪽 가장자리이전의 동일한 이벤트 핸들러 함수에서 반환한 값이벤트를 방지하는 기본 동작이벤트 취소, 웹 프론트엔드 영상】

.type	이벤트 핸들러를 사용하여 여러 이벤트를 처리하는 경우 이 속성을 사용하여 click과 같은 이벤트 유형
.data	이벤트가 호출될 때 추가 매개변수가 전달됩니다.
.target	이벤트를 트리거한 DOM 요소
.	.pageX/Y
	.result
	.preventDefalut()
	.stopPropagation()
	$("#content").click(function(event) { $("#msg").html("<p>外层div元素被单击</p>"); event.stopPropagation(); //通过event方法阻止事件冒泡 }); 【추천 학습: jQuery 동영상 튜토리얼

위 내용은 jquery의 기본 이벤트 메소드는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!