1. 常见问题

1.1. 触摸事件的介绍

Gestures

这个事件针对 IOS 设备上的，一个 Gestures 事件在两个或更多手指触摸屏幕时触发。如果任何手指你正在监听的 Gesture 事件(gesturestart，gesturechange，gestureend)节点上，你将收到对应的 gestures 事件。

• Gesturestart：当一个手指已经按在屏幕上，而另一个手指又触摸在屏幕时触发。
• Gesturechange：当触摸屏幕的任何一个手指的位置发生改变的时候触发。
• Gestureend：当任何一个手指从屏幕上面移开时触发。

触摸事件和手势事件的之间关系：

• 当一个手指放在屏幕上时，会触发 touchstar t 事件，而另一个手指触摸在屏幕上时触发 gesturestart 事件，随后触发基于该手指的 touchstart 事件。
• 如果一个或两个手指在屏幕上滑动时，将会触发 gesturechange 事件，但是只要有一个手指移开时候，则会触发 gestureend 事件，紧接着会触发 touchend 事件。

手势的专有属性：

• rotation: 表示手指变化引起的旋转角度，负值表示逆时针，正值表示顺时针，从 0 开始；
• scale: 表示 2 个手指之间的距离情况，向内收缩会缩短距离，这个值从 1 开始的，并随距离拉大而增长。

1.2. 基本知识点

判断是否为 iPhone

// 判断是否为 iPhone ：
function isAppleMobile() {
  return navigator.platform.indexOf('iPad') != -1;
}

1. 自动大写与自动修正

要关闭这两项功能，可以通过 autocapitalize 与 autocorrect 这两个选项：

<input type="text" autocapitalize="off" autocorrect="off"/>

1. 禁止 iOS 弹出各种操作窗口

-webkit-touch-callout: none;

1. 禁止用户选中文字

-webkit-user-select: none;

1. 关于 iOS 系统中，中文输入法输入英文时，字母之间可能会出现一个六分之一空格

this.value = this.value.replace(/u2006/g, '');

1. Android 上去掉语音输入按钮

input::-webkit-input-speech-button {
  display: none;
}

1. 判断是否为微信浏览器；

function is_weixn() {
  var ua = navigator.userAgent.toLowerCase();
  if (ua.match(/MicroMessenger/i) == 'micromessenger') {
    return true;
  } else {
    return false;
  }
}

1.3. 屏幕旋转事件(onorientationchange)

判断屏幕是否旋转的 JS 代码如下：

function orientationChange() {
  switch (window.orientation) {
    case 0:
      alert('肖像模式 0,screen-width: ' + screen.width + '; screen-height:' + screen.height);
      break;
    case -90:
      alert('左旋 -90,screen-width: ' + screen.width + '; screen-height:' + screen.height);
      break;
    case 90:
      alert('右旋 90,screen-width: ' + screen.width + '; screen-height:' + screen.height);
      break;
    case 180:
      alert('风景模式 180,screen-width: ' + screen.width + '; screen-height:' + screen.height);
      break;
  }
}
// 添加测试监听函数代码如下：
addEventListener('load', function() {
  orientationChange();
  window.onorientationchange = orientationChange;
});