H5移動端原生長按事件

// 函數名longpress
// 參數為: 需長按元素的id、長按之后處理函數func
function longPress(id, func,timeout=500) {
    var timeOutEvent;    
    document.querySelector('#' + id).addEventListener('touchstart', function (e) {
        // 開啟定時器前先清除定時器，防止重復觸發
        clearTimeout(timeOutEvent);
        // 開啟延時定時器
        timeOutEvent = setTimeout(function () {
            // 調用長按之后的邏輯函數func
            func();
        }, timeout); 
    });
    
    document.querySelector('#' + id).addEventListener('touchmove', function (e) {
        // 長按過程中，手指是不能移動的，若移動則清除定時器，中斷長按邏輯
        clearTimeout(timeOutEvent);
        /* e.preventDefault() --> 若阻止默認事件，則在長按元素上滑動時，頁面是不滾動的，按需求設置吧 */
    });
    
    document.querySelector('#' + id).addEventListener('touchend', function (e) {
        // 若手指離開屏幕時，時間小於我們設置的長按時間，則為點擊事件，清除定時器，結束長按邏輯
        clearTimeout(timeOutEvent);
    });
}