Question

美好的一天。我想获得第一次点击或触摸页面的时间戳。此页面可以在普通浏览器或webview中加载，因此最好使用vanilla javascript，而不使用任何库。

这有可能实现吗？或者我必须使用一些jQuery或什么？我只想保存第一次互动的Date.now()。

Answer 1

如果你只想听第一次点击，你可以做一些简单的事情：

window.onclick = function() {
    var timeStamp = Date.now();
    console.log(timeStamp);
    //do manipulations, send data to server / anything you want to do

    //unbind window.onclick (resetting it to empty function)
    window.onclick = function() {}
}

您可以在MDN上阅读有关onclick的更多信息注意这将解除绑定到窗口对象本身的每个 onclick，因为您只能有一个这样的侦听器。然而，another method比window.onclick = function() { ... }更具有以下优势：

它允许为事件添加多个处理程序。这是   对DHTML库或Mozilla扩展特别有用   需要与其他库/扩展一起使用。

当听众被激活时（捕捉与冒泡），它可以让你对相位进行更精细的控制。

它适用于任何DOM元素，而不仅仅是HTML元素。

因此，这基本上允许您添加如下事件：

//first event listener
window.addEventListener('click', function() { console.log('click1'); });
//second event listener (also a click)
window.addEventListener('click', function() { console.log('click2'); });

以上示例将在控制台中输出以下内容：

"click1"
"click2"

addEventListener的{{3}}非常好，如果您需要支持较旧的浏览器，您必须谨慎行事，因为不同的浏览器会有不同的实现。

对于（大多数）触摸设备点击转换为触摸，罚款延迟300毫秒，以检查双击，这不是全部，但相当一致地执行。

在MDN上有一些关于browser support但是如果你向下滚动它还没有真正支持它，其他库实现使用鼠标事件的代码，这些事件被设备转换为点击并将其与某些对象一起使用发起自定义触摸事件的包装器，Touch Web API是其中一个库 - 这个可能有点聪明，如果它们存在但可能使用真正的触摸事件但是我从未使用过Hammer.js之前就此事。

使用vanilla javascript检测点击和触摸事件

1 个答案: