<script type="text/javascript">
<!--
// 셈플용 이벤트 등록 함수
function myAttachEvent(eventObj, event, eventHandler){
if(eventObj.addEventListener) // IE외
eventObj.addEventListener(event, eventHandler, false);
else if(eventObj.attachEvent){
event = 'on'+event;
eventObj.attachEvent(event, eventHandler);
}
}
//-->
</script>
<!--
// 셈플용 이벤트 등록 함수
function myAttachEvent(eventObj, event, eventHandler){
if(eventObj.addEventListener) // IE외
eventObj.addEventListener(event, eventHandler, false);
else if(eventObj.attachEvent){
event = 'on'+event;
eventObj.attachEvent(event, eventHandler);
}
}
//-->
</script>
1. Tag에 직접적용
<input type="button" value="클릭" onclick="alert('클릭 하였습니다.')">
<hr>
2. Tag에 함수호출
<script type="text/javascript">
<!--
function myClick(){
alert('클릭 하였습니다.')
}
//-->
</script>
<input type="button" value="클릭" onclick="myClick()">
<hr>
3. Tag에 함수할당
3.1 직접할당 #1(테그 아래에서 할당)
<input type="button" value="클릭" id="myClick1">
<script type="text/javascript">
<!--
document.getElementById('myClick1').onclick = myClick;
//-->
</script>
<Br>
3.2 직접할당 #2(window.onload 이벤트에서 할당)
<script type="text/javascript">
<!--
myAttachEvent(window,'load', function(){
document.getElementById('myClick2').onclick = myClick;
});
//-->
</script>
<input type="button" value="클릭" id="myClick2">
<Br>
3.3 직접할당 #3(람다함수 할당)
<script type="text/javascript">
<!--
myAttachEvent(window,'load', function(){
document.getElementById('myClick3').onclick = function(){
alert('클릭 하였습니다.')
};
});
//-->
</script>
<input type="button" value="클릭" id="myClick3">
<Br>
3.4 직접할당 #3(이벤트 할당함수 이용)
<script type="text/javascript">
<!--
myAttachEvent(window,'load', function(){
var eventObj = document.getElementById('myClick4');
var event='click';
if(eventObj.addEventListener) // IE외
eventObj.addEventListener(event, myClick, false);
else if(eventObj.attachEvent){
event = 'on'+event;
eventObj.attachEvent(event, myClick);
}
});
//-->
</script>
<input type="button" value="클릭" id="myClick4">
<hr>
'script' 카테고리의 다른 글
jQuery / prototype 과 충돌 해결 (0) | 2014.05.22 |
---|---|
이벤트 처리 addEventListener() (0) | 2014.05.21 |
브라우저 크기, 객체 높이 (0) | 2014.05.20 |
바로가기 스크립트 (0) | 2014.03.12 |
이미지 미리 로딩 (0) | 2014.02.28 |