>웹 프론트엔드 >JS 튜토리얼 >window.addEventListener는 js 이벤트가 여러 function_javascript 기술을 실행하도록 하는 문제를 해결합니다.

window.addEventListener는 js 이벤트가 여러 function_javascript 기술을 실행하도록 하는 문제를 해결합니다.

WBOY
WBOY원래의
2016-05-16 17:45:181311검색

어쩌면 당신도 이런 상황에 직면했을 수도 있습니다. 즉, js 코드에서 window.onload를 사용한 후 본문의 onload 이벤트에 영향을 미칠 수 있습니다. 본문에 모두 쓸 수도 있고, window.onload에 모두 넣을 수도 있지만, 두 가지를 동시에 사용해야 하는 경우가 가끔 있습니다. 이때 window.attachEvent와 window.addEventListener를 사용하여 해결해야 합니다.

해결책은 다음과 같습니다. AttachEvent 및 addEventListener의 사용법은 Google이나 Baidu를 직접 사용할 수 있습니다.

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

if (document.all){
window.attachEvent('onload', 함수 이름)//
}
else{
window.addEventListener('load', 함수 이름, false);//firefox
}

최근 작업에서는 AttachEvent 메소드를 사용하여 특정 이벤트에 다른 처리 이벤트를 첨부할 수 있습니다. 다음은 기본 사용법을 요약한 것입니다.

구문에 대해서는 자세한 지침이 있는 "DHTML 설명서"를 참조하세요. 다음은 인터넷에서 가져온 예입니다.
코드 복사 코드는 다음과 같습니다.

document.getElementById("btn").onclick = method1
document.getElementById("btn") .onclick = method2;
document.getElementById("btn").onclick = method3;

이렇게 작성하면 medhot3만 실행됩니다

이렇게 작성합니다 :
코드 복사 코드는 다음과 같습니다.

var btn1Obj = document.getElementById("btn1");
//object.attachEvent(event,function);
btn1Obj.attachEvent("onclick",method1)
btn1Obj.attachEvent("onclick",method2 );
btn1Obj.attachEvent("onclick ",method3);

실행 순서는 method3->method2->method1

Mozilla 시리즈인 경우 , 이 방법은 지원되지 않으며 addEventListener를 사용해야 합니다.
코드 복사 코드는 다음과 같습니다.

var btn1Obj = document.getElementById("btn1");
//element.addEventListener(type,listener,useCapture)
btn1Obj.addEventListener("click",method1,false); btn1Obj.addEventListener("click",method2,false);
btn1Obj.addEventListener("click",method3,false)

실행 순서는 method1->method2-> 방법3
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.