일반적으로 이벤트 객체는 다음과 같이 작성합니다.
함수 getEvent(이벤트) {
반환 이벤트 || window.event // IE:window.event
}
매개변수가 없으면 다음과 같이 작성할 수도 있습니다(IE가 아닌 경우: 이벤트 객체가 해당 이벤트 처리 함수에 자동으로 전달되며 첫 번째 매개변수임).
함수 getEvent() {
반환 인수[0] || window.event // IE:window.event
}
이런 방식으로 작성하면 Firefox(테스트 버전: 3.0.12, 아래 동일) 이외의 브라우저에서 실행하는 데 문제가 없지만 Firefox는 왜 예외일까요? 다음과 같은 상황을 가정해 보겠습니다.
<button id="btn" onclick="foo()">버튼</button>
<스크립트>
함수 foo(){
var e = getEvent();
경고(e);}
</script>
Firefox에서는 실행 결과가 정의되지 않았습니다. 이유는 무엇입니까?
Firefox의 호출은 실제로 다음과 같습니다. 실행할 첫 번째 호출은 다음과 같습니다.
함수 onclick(이벤트) {
foo();
}
그런 다음 호출이 실행됩니다.
함수 foo(){
var e = getEvent();
경고(e);
}
Firefox의 onclick="foo()"에 있는 foo()는 이벤트 객체 매개변수를 자동으로 전달할 수 없지만 기본적으로 시스템에서 생성된 onclick 함수에 전달된다는 것을 알 수 있습니다. 이 예에서는 getEvent.caller를 전달할 수 있습니다. .caller.arguments[ 0] 이벤트 객체를 가져옵니다.
따라서 getEvent는 다음과 같이 최적화될 수 있습니다(yui_2.7.0b의 event/event-debug.js에 있는 getEvent 메소드 참조).
함수 getEvent(이벤트) {
var ev = 이벤트 ||
만약 (!ev) {
var c = this.getEvent.caller;
동안 (c) {
ev = c.인수[0];
if (ev && (Event == ev.constructor || MouseEvent == ev.constructor)) { /Yi Fei의 메모: YUI 소스 코드 BUG, ev.constructor는 MouseEvent일 수도 있지만 반드시 Event일 필요는 없습니다.
부서지다;
}
c = c.발신자;
}
}
ev를 반환;
}
물론 매개변수를 onclick="foo()"에 수동으로 전달하는 매우 간단한 해결책이 있습니다.
<button id="btn" onclick="foo(event)">버튼</button>