Javascript 奇怪的触摸/点击事件堆栈

我在一个按钮上处理5个事件-

touchstart

、

touchend

、

mousedown

、

mouseup

和

单击

（假设我正在创建类似于“涟漪按钮”的东西）。对于

touchstart/mousedown

我使用统一处理程序，对于

touchend/mouseup

当没有触摸输入时，一切都很好。但当触摸事件出现时，事件堆栈变得太奇怪：

如果您快速单击（读作“触摸”）按钮，则堆栈为：

touchstart

->

touchend

->

mousedown

->

mouseup

->

click

，因此统一处理程序将触发两次（如预期的那样），但单击事件正在触发，这很好

如果点击“保持”然后释放（不移动像素），则堆栈为：

touchstart

->

touchsend

（确定）。但是，正如您所看到的，没有单击事件（实际上是单击）

下面截取的代码完全复制了这个bug（作为设计行为？也许我不明白什么？）。请注意，我没有

preventeddefault

ed或

stopPropagation

ed任何内容，所有事件都完全保存其冒泡和默认行为

实际上，第二种行为更不受欢迎，因为第一种行为是根据规范工作的（基本上，正如上面所描述的那样）

有没有办法解决这个问题（我的意思是，如何返回第二个行为的

click

事件）

class按钮扩展React.Component{
handlePressStart=（事件）=>{
if（event.targetTouches）{
console.log（“touchstart”）
}否则{
console.log（“mousedown”）
}
}
扶手=（事件）=>{
console.log（“不管发生什么事件，按结束键”）
}
handleClick=（事件）=>{
console.log（“单击”）
}
render（）{
返回(
我的按钮棒极了
)
}
}
ReactDOM.render（，document.getElementById（“kappa”））

但没有任何“点击”事件。它只是正常工作。当您在对象上单击

时，单击事件分派-使鼠标向下和鼠标向上保持较短的持续时间。@AlexShtromberg不完全正确。在特定元素上执行
mousedown
和
mouseup
时，使用鼠标指针单击事件会触发。不要紧，你按下鼠标按钮多长时间，只要紧它在哪个元素上开始和结束。