Javascript 如何使div onClick仅在内容上 身体 { 保证金：0； } .集装箱 { 显示：表格； 宽度：100vw； 高度：100vh； 位置：绝对位置； 背景：#000； } .助手 { 显示：表格单元格； 垂直对齐：中间对齐； } .内容 { 左边距：自动； 右边距：自动； 宽度：500px； 高度：200px； 背景：#FFF； }
我需要在用户单击content div时运行一些脚本，在用户单击container div时运行另一个脚本 但当我单击contentdiv时，它会运行contentscript和containerdiv 如何使其仅在单击内容div时运行内容脚本Javascript 如何使div onClick仅在内容上 身体 { 保证金：0； } .集装箱 { 显示：表格； 宽度：100vw； 高度：100vh； 位置：绝对位置； 背景：#000； } .助手 { 显示：表格单元格； 垂直对齐：中间对齐； } .内容 { 左边距：自动； 右边距：自动； 宽度：500px； 高度：200px； 背景：#FFF； },javascript,Javascript,我需要在用户单击content div时运行一些脚本，在用户单击container div时运行另一个脚本 但当我单击contentdiv时，它会运行contentscript和containerdiv 如何使其仅在单击内容div时运行内容脚本 谢谢当您单击某个元素时，事件会向上或向下移动。它取决于第三个参数（true或false）。基于此，您需要停止传播/冒泡，以在希望停止的元素处停止。给你 只需添加一个event.stopPropagation。下面是代码 <html>
谢谢当您单击某个元素时，事件会向上或向下移动。它取决于第三个参数（true或false）。基于此，您需要停止传播/冒泡，以在希望停止的元素处停止。给你
只需添加一个event.stopPropagation。下面是代码
<html>
<head>
<style>
body
{
margin:0;
}
.container
{
display:table;
width:100vw;
height:100vh;
position:absolute;
background:#000;
}
.helper
{
display:table-cell;
vertical-align:middle;
}
.content
{
margin-left:auto;
margin-right:auto;
width:500px;
height:200px;
background:#FFF;
}
</style>
</head>
<body>
<div class="container" onClick="alert('A')">
<div class="helper">
<div class="content" onClick="alert('C')">
</div>
</div>
</div>
</body>
</html>
<div class="container" onclick="alert('A')">
<div class="helper" id="content">
<div class="content" onclick="alert('C') event.stopPropagation;">
</div>
</div>
</div>
</div>