묻고답하기
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
자바스크립트에서의 이벤트에 관한 질문입니다
2003.11.09 21:38
이벤트 객체는 넷스케이프 전용이라고 하는데요.. 이걸 익스플러워에서 실행 가능하게 바꾸려고 하는데
어찌해야 할지 모르겠습니다..
예를들어 아래소스중 pageX는 익스플로워에서는 clientX로 해야하는데요..
그것뿐만 아니라 딴 소스도 바꿔줘야 되는데 어찌해야할지 모르겠습니다
아시는분 꼭좀 답변 부탁드려요.ㅠ_ㅠ
================================================================================================
<html>
<head>
<title> 이벤트 객체 속성 활용 </title>
<script language = "javascript">
<!--
var str;
function mouseDown(event)
{
str = "이벤트 종류:" + event.type+ "임.n";
if(event.which == 1)
{
str = str + "왼쪽 단추가 눌러짐.n";
}
else if(event.which == 3)
{
str = str + "오른쪽 단추가 눌러짐.n";
}
switch(event.modifiers)
{
case 1 : str = str + "Alt 키가 눌러짐.n"; break;
case 2 : str = str + "Ctrl 키가 눌러짐.n"; break;
case 4 : str = str + "Shift 키가 눌러짐.n"; break;
}
str = str + "페이지 상의 위치: [" + event.pageX + " , " + event.pageY + "]n";
str = str + "화면 상의 위치: [" + event.screenX + " , " + event.screenY + "]n";
alert(str);
return true;
}
document.onMouseDown = mouseDown;
//-->
</script>
</head>
<body>
<h2> Event 객체의 활용 예제 </h2>
</body>
</html>
================================================================================================
어찌해야 할지 모르겠습니다..
예를들어 아래소스중 pageX는 익스플로워에서는 clientX로 해야하는데요..
그것뿐만 아니라 딴 소스도 바꿔줘야 되는데 어찌해야할지 모르겠습니다
아시는분 꼭좀 답변 부탁드려요.ㅠ_ㅠ
================================================================================================
<html>
<head>
<title> 이벤트 객체 속성 활용 </title>
<script language = "javascript">
<!--
var str;
function mouseDown(event)
{
str = "이벤트 종류:" + event.type+ "임.n";
if(event.which == 1)
{
str = str + "왼쪽 단추가 눌러짐.n";
}
else if(event.which == 3)
{
str = str + "오른쪽 단추가 눌러짐.n";
}
switch(event.modifiers)
{
case 1 : str = str + "Alt 키가 눌러짐.n"; break;
case 2 : str = str + "Ctrl 키가 눌러짐.n"; break;
case 4 : str = str + "Shift 키가 눌러짐.n"; break;
}
str = str + "페이지 상의 위치: [" + event.pageX + " , " + event.pageY + "]n";
str = str + "화면 상의 위치: [" + event.screenX + " , " + event.screenY + "]n";
alert(str);
return true;
}
document.onMouseDown = mouseDown;
//-->
</script>
</head>
<body>
<h2> Event 객체의 활용 예제 </h2>
</body>
</html>
================================================================================================
댓글 2
-
이너™
2003.11.10 00:08
아.. 정말 감사드립니다(_ _) -
steelheart
2003.11.09 23:04
<script language = "javascript">
<!--
var str;
function mouseDown()
{
str = "이벤트 종류:" + event.type+ "임.\n";
if (event.button == 1) str += "왼쪽 단추가 눌러짐.\n";
else if(event.button == 2) str += "오른쪽 단추가 눌러짐.\n";
if (event.altKey) str += "Alt 키가 눌러짐.\n";
if (event.ctrlKey) str += "Ctrl 키가 눌러짐.\n";
if (event.shiftKey) str += "Shift 키가 눌러짐.\n";
str += "페이지 상의 위치: [" + event.clientX + " , " + event.clientY + "]\n";
str += "화면 상의 위치: [" + event.screenX + " , " + event.screenY + "]\n";
alert(str);
return true;
}
document.onmousedown = mouseDown;
//-->
</script>
차이점만 말씀드리면... 일단 함수선언에서 event가 빠졌습니다.
IE에서는 이벤트가 발생하면 자동으로 event객체에 정보를 저장하므로 특별히 명시할 필요는 없습니다.
event.which 는 event.button 으로 대치되었고 IE에서는 1:왼쪽버튼 2:오른쪽버튼 3:양쪽 버튼 을 말합니다.
event.modifier 는 IE에서는 각각 따로 처리합니다. event.altKey, event.ctrlKeym event.shiftKey 가 true/false냐를
조사함으로써 이벤트 발생시 해당 키가 같이 눌려졌는지 바로 확인 가능합니다.
event.pageX 는 event.clientX 또는 event.x, event.offsetX 등으로 대치가 가능합니다 (값은 상황에 따라 조금 다릅니다)
이벤트 핸들러를 소문자로 쓰지 않고 onMouseDown 등으로 쓰면 IE에서는 제대로 작동하지 않습니다.