W3School TIY Editor
W3School 在线教程
改变方向
暗黑模式
运行代码
<!DOCTYPE html> <html> <body> <style> div { padding: 50px; background-color: rgba(255, 0, 0, 0.2); text-align: center; cursor: pointer; } </style> <h1>The stopPropagation() Method</h1> <p>Click DIV 1:</p> <div onclick="func2()">DIV 2 <div onclick="func1(event)">DIV 1</div> </div> Stop propagation: <input type="checkbox" id="check"> <p></p> <p>因为 DIV 1 位于 Div 2 内，所以当您单击 DIV 1 时，两个 DIV 都会被单击。</p> <p>选中这个停止传播复选框，然后重试。</p> <p>stopPropagation() 方法允许您阻止当前事件的传播。</p> <script> function func1(event) { alert("DIV 1"); if (document.getElementById("check").checked) { event.stopPropagation(); } } function func2() { alert("DIV 2"); } </script> </body> </html>