JavaScript에서 이벤트를 바인딩하고 바인딩 해제하는 방법

이 기사는 JavaScript 이벤트의 바인딩 및 바인딩 해제에 대해 공유할 것이며 이는 특정 참조 값을 가지며 모든 사람에게 도움이 되기를 바랍니다.

JavaScript의 이벤트는 HTML을 클릭할 때 발생한다는 의미입니다. 요소, 섹션이 시작됩니다. JavaScript, 브라우저 동작을 트리거하려면 이벤트 바인딩을 사용해야 하는 경우가 많습니다. 다음으로 몇 가지 일반적인 이벤트 바인딩 방법과

이벤트 바인딩

을 해제하는 방법을 자세히 알려드리겠습니다. onclick 이벤트

는 마우스를 눌렀을 때 실행되는 개체를 말합니다. 요소는 하나의 이벤트에만 바인딩될 수 있습니다.

사각형을 마우스로 클릭하면 배경색이 변경됩니다.

window.onload=function(){
var div=document.getElementsByTagName("div")[0];
div.onclick=function(){
div.style.backgroundColor="pink";
console.log(1);
}
}

Rendering

Before click

클릭 후

addEventListener(event, function, useCapture)

가 지정된 요소를 가리켜 이벤트 핸들을 추가할 수 있습니다. IE9

event: 문자열 형식으로 이벤트 이름을 지정합니다.

function: 이벤트가 트리거될 때 실행되는 함수를 나타냅니다.

useCapture: 이벤트가 캡처에서 실행되는지 여부를 나타내는 부울 값 버블링 단계, 여기서 true는 캡처 단계에서 이벤트 핸들이 실행됨을 의미하고 false는 버블링 단계에서 실행될 이벤트 핸들러를 나타냅니다. 여기서 false는 기본값을 나타냅니다

 window.onload=function(){
   var div=document.getElementsByTagName("div")[0];
     div.addEventListener('click',function(){
     		div.style.backgroundColor="pink";
     },false);
 }//用addEventListener绑定一个click事件，当点击时使背景颜色改变

참고: 이벤트를 작성할 때 쓰지 않도록 주의하세요. on, click을 직접 작성하세요. 대부분 false라고 작성하세요

attachEvent(event, function)

a 이벤트는 여러 핸들러에 바인딩될 수 있으며, 동일한 함수가 여러 번 바인딩될 수도 있습니다.

event: 바인딩해야 하는 이벤트 유형입니다.

function: 이벤트가 트리거될 때 실행되는 항목을 나타냅니다.

window.onload=function(){
var div=document.getElementsByTagName("div")[0];
 div.attachEvent('onclick',function(){
 div.style.backgroundColor="pink";
     });
 }

참고: 프로그램은 다음에서 실행되어야 합니다. IE 브라우저.

이벤트 바인딩 해제

onclick =false/null

값을 false 또는 null로 설정하여 onclick 이벤트 바인딩을 해제

window.onload=function(){
   var div=document.getElementsByTagName("div")[0];
     div.onclick=function(){
     		div.style.backgroundColor="pink";
     }
     div.onclick=null;

removeEventListener(event, function, useCapture)

이 사용됩니다. 에 addEventListener 이벤트를 바인딩 해제합니다. 바인딩을 해제할 때 함수를 직접 작성할 수 없습니다.

 window.onload=function(){
   var div=document.getElementsByTagName("div")[0];
     div.addEventListener('click',demo,false);
     function demo(){
     	div.style.backgroundColor="pink";
     }
     div.removeEventListener('click',demo,false);
 }//用addEventListener绑定一个click事件，当点击时使背景颜色改变

detachEvent(event, function)

은 바인딩할 때 주의하세요. , 함수를 직접 작성할 수는 없습니다. 함수는 외부에서 작성해야 합니다.

 window.onload=function(){
   var div=document.getElementsByTagName("div")[0];
     div.attachEvent('onclick',demo);
     function demo(){
     	div.style.backgroundColor="pink";
     }
     div.detachEvent('onclick',demo);
     }

요약: 위 내용이 이 글의 전체 내용입니다. JavaScript에서 이벤트 바인딩을 배우는 데 도움이 되기를 바랍니다

위 내용은 JavaScript에서 이벤트를 바인딩하고 바인딩 해제하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!