该效果是当你点击bigdiv是弹出big 当你点击smalldiv是弹出small并不会弹出bigdiv
代码如下
<!DOCTYPE html>
<html>
<head>
<title>2.html</title>
<style type="text/css">
#bigid {
width: 300px;
height: 300px;
border: 1px solid red;
}
#smallid {
width: 100px;
height: 100px;
border: 1px solid red;
}
</style>
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script type="text/javascript">
$(function(){
$("#bigid").click(function(){
alert("big");
});
$("#smallid").click(function(event){
alert("small");
event=event||window.event;
if(event.stopPropagation){
event.stopPropagation();
}else{
event.cancelBubble=true;
}
});
});
</script>
</head>
<body>
<div id="bigid">big
<div id="smallid">small</div></div>
</body>
</html>