JS / jQuery WHILE 按住 LMB 事件

Question

我在 jQuery/JS 中做一些动画，我想根据是否按住 LMB（鼠标左键）来更改我的 Pull_Push 变量。

现在我正在寻找一个示例，但只找到了 .mousedown() 和 .mouseup() 事件，但它们似乎在按下/释放按钮时触发。我需要这两者之间的事件。（按住）

这是我想我必须修复的部分：

var pull_or_push = "push";
$(document).on("mousedown", function () {
    var pull_or_push = "pull";
});
$(document).on("mouseup", function () {
    var pull_or_push = "push";
});

你认为有什么方法可以实现我想要的吗？

Answer 1

考虑使用 requestAnimationFrame 在间隔中高效地运行编码。使用 setInterval 或 setTimeout 也可以，但 requestAnimationFrame 是专门为这种事情而设计的。

在下面的示例中，doSomething 函数只会在调用 mousedown 后启动运行ning，然后在调用 mouseup 后停止运行ning。但是您可以通过在这些事件中的任一事件之外调用您的 doSomething 函数，轻松地使代码始终运行ning。这样，只需检查 pull_or_push 的状态，您就可以在按下 LMB 时执行某些操作，而在未按下 LMB 时执行其他操作。

另请注意，在您的 mouseup 和 mousedown 回调中，您 re-declaring pull_or_push 而不是修改全局变量（只需删除 var）。

var pull_or_push = "push";
var request;

$(document).on("mousedown", function () {
    pull_or_push = "pull";
    doSomething();

});
$(document).on("mouseup", function () {
    pull_or_push = "push";
    cancelAnimationFrame(request)
});

function doSomething(dt){
  console.log("Doing something")
  request = requestAnimationFrame(doSomething)
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

JS / jQuery WHILE 按住 LMB 事件

JS / jQuery WHILE holding down LMB event

javascript

jquery

mouseevent