ios移动端浏览器不支持dblclick事件触发

ios端他自己有一个双击空白区域会自己放大缩小视窗,我怀疑就是这个功能导致dblclick无法正常触发,于是只能通过单次cilick来判断了.

当第二次click的触发时间小于400ms说明是双击,于是通过创建时间戳进行对比.

 let lastClickTime = 0;
 let clickTimer;
 $('#body').on("click", e => {
   let nowTime = new Date().getTime();
      if (nowTime - lastClickTime < 400) {
         /*双击*/
         lastClickTime = 0;
         clickTimer && clearTimeout(clickTimer); 
         alert("双击");
      } else {
         /*单击*/
         lastClickTime = nowTime;
         clickTimer = setTimeout(() => {
            // alert("单击");
         }, 400);
      }
 });

用jq的方法给元素绑定一个click事件,当第一次点击时,lastClickTime上一次的触发为0,还没有赋值,nowTime 为现在的时间,nowTime - lastClickTime可以理解为2019年- 0 年,怎么也要大于400ms,这里就识别为单独一次click,然后我们将这次的nowTime赋值给lastClickTime,等待下一次click时用于判断,由于click单次肯定触发快于双击,所以我们给他加上一个定时器,400ms后触发,如果400ms后未发生双击就触发,双击了,前面的单击不运行,于是在if判断中触发时间小于400ms,判断为双击,然后将lastClickTime 重置为0,下次双击也是相同套路判断.

然后判断,如果单击的定时器存在,我们就清除掉,然后在运行双击需要触发的函数即可.