js 이벤트 전달 및 거품 처리

 
<div>
<table nclick="gotClick(event,'table',this)" id="table">
<tr nclick="gotClick(event,'tr',this)" id="tr">
<td nclick="gotClick(event,'td',this)" id="td">
<input type="button" name="button" value=" "
onclick="gotClick(event,' ',this);" id="button">
</td>
</tr>
</table>
</div>
<div id='result'>
</div>
js 파일
 
function gotClick(event,msg,obj){
var object;
var msgs = msg+" => !<br/>";
try{
if (event.target) {//Mozilla
object = event.target;
// alert(document.getElementById(object.id).nodeName+" Mozilla "+msg);
document.getElementById('result').innerHTML +=msgs;
// event.cancelBubble=true;//
}
else if(event.srcElement){//IE
object = event.srcElement;
// alert(object.id+" IE "+msg);
// event.cancelBubble=true;//
document.getElementById('result').innerHTML +=msgs;
}
}catch(e){
alert(e);
}

}
실행 결 과 는:버튼=>눌 렸 습 니 다!td=>눌 렸 습 니 다!tr=>눌 렸 어!table=>눌 렸 습 니 다!

좋은 웹페이지 즐겨찾기