本文主要是介绍js mouseup和mousedown 阻止冒泡事件-解决方法，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
主要看id为c4，
核心思路：比如当前你要点击一个a标签跳转到别的地方，鼠标按下去后（还没松开），突然不想点了，然后把鼠标移到别处去，然后，a标签是不会被触发的，这里用的就是这个思路。
<!DOCTYPE html>
<html lang="en"><head><meta charset="utf-8"><style type="text/css">body{width:1000px; height:800px;color:#000;}#c1{ width:600px; height:600px; background:pink;}#c2{ position:relative; width:400px; height:400px; background:red; overflow:hidden;}#c3{ width:200px; height:200px; background:blue;}#c4{display:none;position:absolute;top:0;left:0;z-index: 999;width:600px; height:600px;opacity:0.2;background:blue;border:1px solid yellow;}</style></head><body><div id="c4">4</div><div id="c1">1<div id="c2">2<div id="c3">3</div></div></div><script type="text/javascript">var oBox1 = document.getElementById('c1');var oBox2 = document.getElementById('c2');var oBox3 = document.getElementById('c3');var oBox4 = document.getElementById('c4');var flag = true;oBox1.addEventListener('click',function(e){console.log(1);},flag);oBox2.addEventListener('click',function(e){console.log(2);},flag);oBox3.addEventListener('mousedown',function(e){e.stopPropagation();console.log('3-mosuedown');oBox4.style.display = 'block';},flag);oBox4.addEventListener('mouseup',function(e){e.stopPropagation();console.log('oBox4');oBox4.style.display = 'none';},flag);</script></body>
</html>这篇关于js mouseup和mousedown 阻止冒泡事件-解决方法的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
