☰

Greasy Fork镜像 还支持 简体中文。

jQueryTouchActionEx

簡単なタッチ操作のイベントを追加します

此腳本不應該直接安裝，它是一個供其他腳本使用的函式庫。欲使用本函式庫，請在腳本 metadata 寫上： // @require https://update.gf.qytechs.cn/scripts/419065/894972/jQueryTouchActionEx.js 

  1. // ==UserScript==
  2. // @name         jQuery touch action Ex
  3. // @version      0.3.1
  4. // @description  簡単なタッチ操作のイベントを追加します
  5. // @author       y_kahou
  6. // ==/UserScript==
  7.  
  8. if (window.jQuery) (function($) {
  9.     'use strict';
  10.     
  11.     // 通常のタップ
  12.     $.fn.tap = function(interval = 200) {
  13.         // すでにtapまたはdoubletapを設定していたら何もしない
  14.         if ($(this).prop('tap') || $(this).prop('doubletap'))
  15.             return $(this)
  16.         $(this).attr('tap','')
  17.         
  18.         return $(this).on({
  19.             touchstart: function(e) {
  20.                 if (e.targetTouches.length > 1) {
  21.                     $(this).data('tap', false)
  22.                     return
  23.                 }
  24.                 $(this).data('tap', true)
  25.                 var to = setTimeout(() => {
  26.                     $(this).data('tap', false)
  27.                     $(this).trigger('hold')
  28.                 }, interval)
  29.                 $(this).data('tap_to', to)
  30.             },
  31.             touchmove: function(e) {
  32.                 if (!$(this).data('tap'))
  33.                     return
  34.                 $(this).trigger('subfocus')
  35.                 $(this).data('tap', false)
  36.                 clearTimeout($(this).data('tap_to'))
  37.             },
  38.             touchend: function(e) {
  39.                 if (!$(this).data('tap'))
  40.                     return
  41.                 $(this).data('tap', false)
  42.                 clearTimeout($(this).data('tap_to'))
  43.                 e.type = 'tap'
  44.                 e.touches = e.changedTouches
  45.                 e.changedTouches = void(0)
  46.                 $(this).trigger(e)
  47.                 e.preventDefault()
  48.             }
  49.         })
  50.     }
  51.     
  52.     // ダブルタップを考慮したタップとダブルタップ
  53.     $.fn.doubletap = function(interval = 200) {
  54.         // すでにtapまたはdoubletapを設定していたら何もしない
  55.         if ($(this).prop('tap') || $(this).prop('doubletap'))
  56.             return $(this)
  57.         $(this).attr('doubletap','')
  58.         
  59.         return $(this).on({
  60.             touchstart: function(e) {
  61.                 if (e.targetTouches.length > 1) {
  62.                     $(this).data('tap', false)
  63.                     return
  64.                 }
  65.                 $(this).data('tap', true)
  66.                 var to = setTimeout(() => {
  67.                     $(this).data('tap', false)
  68.                     $(this).trigger('hold')
  69.                 }, interval)
  70.                 $(this).data('tap_to', to)
  71.             },
  72.             touchmove: function(e) {
  73.                 if (!$(this).data('tap'))
  74.                     return
  75.                 $(this).trigger('subfocus')
  76.                 $(this).data('tap', false)
  77.                 clearTimeout($(this).data('tap_to'))
  78.             },
  79.             touchend: function(e) {
  80.                 if (!$(this).data('tap'))
  81.                     return
  82.                 $(this).data('tap', false)
  83.                 clearTimeout($(this).data('tap_to'))
  84.                 e.type = 'temp'
  85.                 $(this).trigger(e)
  86.                 e.preventDefault()
  87.             },
  88.             temp: function(e) {
  89.                 e.touches = e.changedTouches
  90.                 e.changedTouches = void(0)
  91.                 if ($(this).data('dbltap')) {
  92.                     $(this).data('dbltap', false)
  93.                     clearTimeout($(this).data('dbltap_to'))
  94.                     e.type = 'doubletap'
  95.                     $(this).trigger(e)
  96.                 } else {
  97.                     $(this).data('dbltap', true)
  98.                     var to = setTimeout(() => {
  99.                         $(this).data('dbltap', false)
  100.                         e.type = 'tap'
  101.                         $(this).trigger(e)
  102.                     }, interval)
  103.                     $(this).data('dbltap_to', to)
  104.                 }
  105.             }
  106.         })
  107.     }
  108.     
  109.     $.fn.swipe = function(min_dist = 50) {
  110.         // すでにswipeを設定していたら何もしない
  111.         if ($(this).prop('swipe'))
  112.             return $(this)
  113.         $(this).attr('swipe','')
  114.         
  115.         return $(this).on({
  116.             touchstart: function(e) {
  117.                 if (e.touches.length > 1) {
  118.                     $(this).data('start_point', '')
  119.                     return
  120.                 }
  121.                 var x = Math.floor(e.touches[0].screenX)
  122.                 var y = Math.floor(e.touches[0].screenY)
  123.                 $(this).data('start_point', `${x},${y}`)
  124.             },
  125.             touchmove: function(e) {
  126.                 if (e.touches.length > 1) {
  127.                     $(this).data('start_point', '')
  128.                     return
  129.                 }
  130.             },
  131.             touchend: function(e) {
  132.                 if (e.changedTouches.length > 1)
  133.                     return
  134.                 var p = $(this).data('start_point')
  135.                 if (!p)
  136.                     return
  137.                 var x1 = Number(p.split(',')[0])
  138.                 var y1 = Number(p.split(',')[1])
  139.                 var x2 = Math.floor(e.changedTouches[0].screenX)
  140.                 var y2 = Math.floor(e.changedTouches[0].screenY)
  141.                 var ang = Math.atan2(y2 - y1, x2 - x1) * 180 / Math.PI
  142.                 if (ang < 0) ang += 360
  143.                 
  144.                 var dist = Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2))
  145.                 if (min_dist < dist) {
  146.                     let from = { x: x1, y: y1 }
  147.                     let dest = { x: x2, y: y2 }
  148.                     $(this).trigger('swipe', [ang, dist, from, dest])
  149.                 }
  150.             }
  151.         })
  152.     }
  153.     
  154.     // 4方向のスワイプ判定
  155.     $.fn.swipe_way = function({min_dist = 50, range = 90} = {}) {
  156.         // すでにswipe_wayを設定していたら何もしない
  157.         if ($(this).prop('swipe_way'))
  158.             return $(this)
  159.         
  160.         // swipe未設定なら設定
  161.         if (!$(this).prop('swipe')) {
  162.             $(this).swipe(min_dist)
  163.         }
  164.         $(this).removeAttr('swipe')
  165.         $(this).attr('swipe_way','')
  166.         
  167.         return $(this).on('swipe', function(e, ang, dist, from, dest) {
  168.             const ways = ['right', 'down', 'left', 'up']
  169.             for (var i in ways) {
  170.                 var ang_ = (i==0 && 270<ang ? ang-360 : ang)
  171.                 if (Math.abs(90 * i - ang_) <= range / 2) {
  172.                     $(this).trigger('swipe' + ways[i], [ang, dist, from, dest])
  173.                     break
  174.                 }
  175.             }
  176.         })
  177.     }
  178. })(window.jQuery);
  179.  

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址