我给一个p添加了mouseup事件 如何在点击p的滚动条时不出发mouseup事件?如何用js解决?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="http://code.jquery.com/jquery...
<style type="text/css">
ul{ display: block; width: 100px; height: 200px; overflow: auto; margin: 20px auto; border: 1px solid red; }
ul li{display: block;}
</style>
</head>
<body>
<ul>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
<li>8000</li>
</ul>
</body>
</html>
<script type="text/javascript">
$(function(){
$("ul").mouseup(function(event) {
alert(1);
});
});
</script>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
滚动条属于ul,所以肯定会触发,可以考虑在外面加一个p,添加宽高overflow属性,内部的ul高度自动就好这样给ul添加点击事件就不会再触发了
提供个思路,不触发是不大可能的,但是能做个判断,用this.clientWidth,this.offsetLeft和event.clientX做个比较。判断是否点击在了滚动条上。是的话直接返回。
有个想法但是没有被验证:
将 mousedown, mouseup 和 mousemove 事件同时注册到一个函数上;
将 mousedown 作为函数内动作的起点/条件分裂点,即如果鼠标按下后,出现 mousemove 事件,就返回;否则如果出现 mouseup 事件,就执行某个动作
仅仅是想法,希望能有更多启发