div包含a标签时，点击a标签两个事件同时出发的问题

Question

代码如下<div onclick="alert(1)" style="width: 100px;border: 1px solid #550101;" align="center">
<a href="javascript:alert(2);">click this</a>
</div>点击a标签的时候会同时出发div的onclick事件，有什么办法能解决此问题呢，点击a标签的时候不触发div的onclick事件。

Answer 1

<div onclick="alert(1)" style="width: 100px;border: 1px solid #550101;" align="center">
<a href="#" onclick="event.cancelBubble=true;alert(2);">click this</a>
</div>

Answer 2

事件有冒泡机制。可以
function doSomething (obj,evt) {
alert(obj.id);
var e=(evt)?evt:window.event;
if (window.event) {//浏览器兼容
e.cancelBubble=true;
} else {
//e.preventDefault();
e.stopPropagation();
}
alert (2);
} 
onclick="doSomething(this,event);"