<!DOCTYPE HTML>
<html>
<head>
<title>Test Demo....</title>
<style type="text/css">
div[id=inner_1]:hover{
background-color: #AAAAAA;
}
</style>
</head>
<body>
<div id="__temp">
Outer
<div id="inner_1">Inner_1</div>
<div id="inner_2">Inner_2</div>
</div>
</body>
<script type="text/javascript">
document.getElementById("__temp").onclick = function() {
alert("Outer......");
}
document.getElementById("inner_1").onclick = function() {
alert("Inner......");
event.cancelBubble=true;
}
document.getElementById("inner_2").onclick = function() {
alert("Inner......");
// event.cancelBubble=true;
}
</script>
</html>
画龙点睛的一笔: event.cancelBubble=true;