我正在尝试使用 js slider slick ，但是当我在我的网站上包含 slider 代码时，默认的“可拖动”选项不起作用。 更具体地说，我无法在幻灯片 div 或我的网页 (Chrome) 中的文档上捕获任何 mousemove 事件。
当在本地运行代码时，我可以毫无问题地观察到“mouseup”、“mousemove”和“mouseup”事件，但是当我将 slider 代码放入网页时，我只能观察到“mouseup”和“鼠标按下事件。
下面是工作的本地代码。如果您运行它，它将在 slider div 中记录 mousedown、mousemove 和 mouseup 事件。
当我将相同的代码移动到网站时，我根本无法观察到来自 slider div 或文档的任何 mousemove 事件。 是否已经运行了一些 js完全阻止页面触发 mousemove 事件？
<html>
<head>
<title>My Now Amazing Webpage</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.css"/>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.js"></script>
</head>
<body>
<style>
#container {
width: 450px;
height: 300px;
margin: 0 auto;
border: 2px solid black;
}
</style>
<div id="container">
<div class="your-class">
<div><img src="http://lorempixel.com/300/300" /></div>
<div><img src="http://lorempixel.com/300/300" /></div>
<div><img src="http://lorempixel.com/300/300" /></div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.your-class').slick();
$('.slick-slide').on('mousemove', function(e){
console.log("mousemove");
});
$('.slick-slide').on('mousedown', function(e){
console.log("mousedown");
});
$('.slick-slide').on('mouseup', function(e){
console.log("mouseup");
});
});
</script>
</body>
</html>
最佳答案
不确定这是否回答了您的具体问题，但它可能对出现在这里的其他人有所帮助。
如果您正在使用 Chrome 开发工具(例如)进行测试并且您有一个设备配置文件处于事件状态，那么 Chrome 将模拟触摸交互并且不会发送 mousemove 事件(对于浏览器无法发送的手机/平板电脑来说就是这种情况)如果用户的手指没有触摸屏幕，则不要告知用户何时手指。
如果您将设备类型从(例如)“桌面(触摸)”更改为“桌面”，您将保持所需的屏幕大小，但会重新获得鼠标事件。
关于javascript - Mousemove 事件未在页面元素或文档上触发，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37731975/