javascript - 如何在没有 jQuery 的情况下在移动设备中检测 JavaScript 中的长触摸

Question

我在 StackOverflow 上找到了一些解决方案，但大多数都使用 jQuery。有没有办法用纯 JavaScript 或 ReactJS 来做到这一点。

Answer 1

这是鼠标事件的基本演示:http://codepen.io/zvona/pen/avYgJg?editors=011 。您还需要使用 onTouchStart 和 onTouchEnd。此外，还应根据您的目的调整延迟(当前为 300 毫秒)。

var LongTouch = React.createClass({
  getInitialState() {
    return {
      value: 'Touch me'
    }
  },

  startTouch() {
    this.touchTimeout = window.setTimeout(function() {
      this.setState({
        value: 'Long touch triggered'
      });
    }.bind(this), 300);
  },

  endTouch() {
    window.clearTimeout(this.touchTimeout);
    this.setState(this.getInitialState());
  },

  render() {
    return (
      <div
        className='longTouch'
        onMouseDown={this.startTouch}
        onMouseUp={this.endTouch}>
        {this.state.value}
      </div>
    )
  }
});