jQuery添加iPad的阻力/触摸支持

>此jQuery代码片段增加了对iPad和其他触摸式设备的拖放和触摸支持。 在使用JQuery UI的可拖动功能和浮动元素时，这特别有用。

>

//iPad Touch Support
$.fn.addTouch = function() {
  this.each(function(i, el) {
    $(el).bind('touchstart touchmove touchend touchcancel', function(event) {
      handleTouch(event);
    });
  });

  const handleTouch = function(event) {
    const touches = event.changedTouches,
          first = touches[0],
          type = '';

    switch (event.type) {
      case 'touchstart':
        type = 'mousedown';
        break;
      case 'touchmove':
        type = 'mousemove';
        event.preventDefault();
        break;
      case 'touchend':
        type = 'mouseup';
        break;
      default:
        return;
    }

    const simulatedEvent = document.createEvent('MouseEvent');
    simulatedEvent.initMouseEvent(type, true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY, false, false, false, false, 0, null);
    first.target.dispatchEvent(simulatedEvent);
  };
};

常见问题（常见问题解答）：jQuery和iPad touch支持>

本节解决了有关iPad和其他触摸设备上的jQuery和touch事件处理的常见问题。

问：如何使用jQuery？ >a：

使用jQuery UI触摸打孔。该插件桥接了触摸事件和jQuery UI的拖动功能之间的差距。 在jQuery UI之后和任何依赖脚本之前包括在内。

> Q：jQuery可以在iPad的Safari浏览器中识别触摸事件吗？

a：是的。 jQuery支持，

，

， 用于构建启用触摸的Web应用程序的事件。touchstart touchmovetouchend问：如何将jQuery编辑的html表保存到本地存储？ touchcancel>

a：

>使用jQuery将表数据转换为JSON对象，然后使用存储它。稍后用>。

检索

问：jQuery在闪亮的事物技术堆栈中的角色是什么？ >localStorage.setItem()a：localStorage.getItem()在闪亮的事物中，jQuery用作轻巧，高效的JavaScript库，简化了HTML操纵，事件处理和各种浏览器的动画。

>

问：如何使用jquery.touch插件？ 在jQuery脚本之后，在HTML中添加

a：

。 该插件通过触摸事件和CSS3动画功能增强了jQuery。 问：如何在Ubuntu上解决jQuery问题？

>

a：>检查浏览器的控制台是否有错误消息，验证html中的正确jQuery包含，并确保您的jQuery代码没有语法错误。>

Q：我可以使用jQuery创建一个触摸的滑块？ 是的 问：如何优化触摸设备的jQuery代码？ jQuery.touch.js>

a：

>最大程度地减少重型动画，减少DOM操纵并采用事件委派进行有效的事件处理。> Q：jQuery可以检测到iPad Touch事件类型吗？ 是的

问：如何在iPad上使用jQuery处理多点触摸手势？

>a：这更复杂，需要跟踪多个接触点。考虑使用诸如jQuery多功能之类的插件进行简化。

>

以上是jQuery添加iPad的阻力/触摸支持的详细内容。更多信息请关注PHP中文网其他相关文章！