您好,登錄后才能下訂單哦!
這篇文章主要介紹“jquery有沒有touch功能”,在日常操作中,相信很多人在jquery有沒有touch功能問題上存在疑惑,小編查閱了各式資料,整理出簡單好用的操作方法,希望對大家解答”jquery有沒有touch功能”的疑惑有所幫助!接下來,請跟著小編一起來學習吧!
jquery中有touch功能;touch功能會在用戶在觸碰頁面時觸發:1、tap事件在用戶敲擊某個元素時觸發;2、taphold事件在用戶敲擊某個元素并保持一秒時觸發;3、swipe事件在用戶在某個元素上水平滑動超過30px時觸發;4、swipeleft事件在用戶在某個元素上從左滑動超過30px時觸發;5、swiperight事件在用戶在某個元素上從右滑動超過30px時觸發。
本教程操作環境:windows10系統、jquery3.4.1版本、Dell G3電腦。
Touch 事件在用戶觸摸屏幕(頁面)時觸發。
tap 事件在用戶敲擊某個元素時觸發。
taphold 事件在用戶敲擊某個元素并保持一秒時被觸發
swipe 事件在用戶在某個元素上水平滑動超過 30px 時被觸發:
swipeleft 事件在用戶在某個元素上從左滑動超過 30px 時被觸發:
swiperight 事件在用戶在某個元素上從右滑動超過 30px 時被觸發:
簡單解釋:
tap(輕擊):一次快速完整的輕擊后觸發
taphold(輕擊不放):輕擊并不放(大約一秒)后觸發
swipe(滑動):一秒內水平拖拽大于30PX,或者縱向拖曳小于20px的事件發生時觸發的事件。多長時間拖拽多少px可以設置的。這個事件有其相關聯的屬性,分別為
scrollSupressionThreshold (默認: 10px) – 水平方向拖拽大于這個值,將不觸發。
durationThreshold (默認: 1000ms) – 滑動時間超過這個數值就不會產生滑動事件。
horizontalDistanceThreshold (默認: 30px) – 水平劃動距離超過這個數值才會產生滑動事件。
verticalDistanceThreshold (默認: 75px) – 豎直劃動距離小于這個數值才會產生滑動事件。
swipeleft(左劃):劃動事件為向左的方向時觸發
swiperight(右劃):劃動事件為向右的方向時觸發
示例如下:
tap(輕擊):一次快速完整的輕擊后觸發
$(function(){ $("#home").live('tap', function() { $('#toPage2').click(); // 為首頁綁定點擊事件 }); $("#page-2").live('tap', function() { $('#toHome').click(); // 為另一頁面綁定點擊事件 }); });
taphold(輕擊不放):輕擊并不放(大約一秒)后觸發
$(function(){ $("#home").live('taphole', function() { $('#toPage2').click(); // 為首頁綁定長按事件 }); $("#page-2").live('taphole', function() { $('#toHome').click(); // 為另一頁面綁定長按事件 }); });
swipe(滑動) : 隨便左右滑動
$(function(){ $("#home").live('swipe', function() { $('#toPage2').click(); // 為首頁綁定滑動事件 }); $("#page-2").live('swipe', function() { $('#toHome').click(); // 為另一頁面綁定滑動事件 }); });
到此,關于“jquery有沒有touch功能”的學習就結束了,希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習,快去試試吧!若想繼續學習更多相關知識,請繼續關注億速云網站,小編會繼續努力為大家帶來更多實用的文章!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。