您當前位置：首頁 > 互聯網 > 觸屏touchstart 與 click

觸屏touchstart 與 click

來源：程序員人生發布時間：2014-09-17 14:30:48 閱讀次數：2632次

設計效果：當手指點擊或觸摸紅框線menuList之外的部分時，彈框menuList消失。

問題：在優化觸屏版的時候發現如圖問題，當menuList彈出，手指觸摸屏幕向下滑動時，menuList彈框不消失，只有手指點擊menuList之外的部分才消失。

查看代碼發現，源代碼只定義了click事件：

$(doc.body).on('click',function(e) { if (e.target.id != 'menu') headerMenu.hide(); });

說明觸屏版對click和touch解析是不同的事件。

于是查了下touch的用法，發現是有touchstart,touchmove,touchend事件的，并且可以像click樣直接使用。

于是更改代碼：

$(doc.body).on('click touchmove',function(e) { if (e.target.id != 'menu') headerMenu.hide(); });

OK，可以

更多demo和解析：http://www.aliued.cn/2013/04/27/%E7%A7%BB%E5%8A%A8%E5%BC%80%E5%8F%91%E4%B9%8Btouch-event%E7%AF%87.html

生活不易，碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈
程序員人生

------分隔線----------------------------

上一篇 微信開發HTML5輕游戲中的幾個坑

下一篇 百度技術開放日感悟：看百度如何獲取大數據時代的“船票”

分享到:

------分隔線----------------------------

為碼而活

積分：4237

15粉絲

7關注

欄目熱點

日本搞逼视频_黄色一级片免费在线观看_色99久久_性明星video另类hd_欧美77_综合在线视频