Div 嵌套事件
当多个div嵌套时候,点击最里层的div,会调用外层div的事件。
如果我们要实现点击div,只是调用当前div的事件,闲话不说,贴出代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Div.aspx.cs" Inherits="Div" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script language="javascript" type="text/javascript">
function BigDiv(event) {
alert("Big");
if (event.stopPropagation)
{
event.stopPropagation();//在基于firefox内核的浏览器中支持做法stopPropagation
}
else
{
event.cancelBubble = true;//基于ie的写法
}
}
function LittleDiv() {
alert("little");
event.cancelBubble = true;
}
function yy() {
alert("sb");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id ="fdk1" onclick="yy()">
YY
<!--此处会调用yy()事件-->
<div id="child2" onclick="BigDiv(event)">
大div
<!--加event.cancelBubble=true",只调用当前div的事件,禁止事件的浮生-->
<div onclick="LittleDiv();">
小div</div>
</div>
</div>
</form>
</body>
</html>