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中文網其他相關文章！