Question

你好，我已经实现了一个长按javascript事件处理程序，它工作得很好。但是，在移动设备上，用户点击...按住...以向上或向下滚动。移动设备上的这种滚动交互无意中触发了我的“ pointerdown”事件。我尝试在事件处理程序链中插入pointermove事件，但这似乎会触发任意次数，具体取决于用户在下指针时将指针移动多长时间，因此我无法设置布尔值那是可靠的，不会来回翻转。

let pressTimer;
this.myElements.on('pointerup', (e) => {
  clearTimeout(pressTimer);
}).on('pointerdown', (e) => {
  let myEl = $(e.currentTarget);
  let checkbox= myEl.find('.checkbox');
  pressTimer = window.setTimeout(() => {
    checkbox.click();
  }, 750)
});

Answer 1

您可以添加一个全局布尔变量，该变量保存指针的当前状态（也许是 isPointerDown ）并采取相应的措施。例如如果为true，则不要对pointerdown做出反应，并且如果存在pointerup事件，请将此变量重置为false。

let pressTimer;
var isPointerDown = false;
this.myElements.on('pointerup', (e) => {
  clearTimeout(pressTimer);
  isPointerDown = false;
}).on('pointerdown', (e) => {
  if (!isPointerDown) {
    let myEl = $(e.currentTarget);
    let checkbox = myEl.find('.checkbox');
    pressTimer = window.setTimeout(() => {
      isPointerDown = true;
      checkbox.click();
    }, 750)
  }
});

防止用户点击并滚动时在移动设备上触发pointerdown事件

1 个答案: