js监听长按事件

let longPressTimer;
const longPressDuration = 500; // 长按时间，单位毫秒

function startLongPress(element, callback) {
    longPressTimer = setTimeout(() => {
        callback();
    }, longPressDuration);
}

function cancelLongPress() {
    clearTimeout(longPressTimer);
}

// 使用示例
const element = document.getElementById('long-press-element');

element.addEventListener('mousedown', () => {
    startLongPress(element, () => {
        console.log('长按事件触发');
        // 在这里执行长按事件的回调逻辑
    });
});

element.addEventListener('mouseup', cancelLongPress);
element.addEventListener('mouseleave', cancelLongPress);

let touchLongPressTimer;
const touchLongPressDuration = 500; // 长按时间，单位毫秒

function startTouchLongPress(element, callback) {
    touchLongPressTimer = setTimeout(() => {
        callback();
    }, touchLongPressDuration);
}

function cancelTouchLongPress() {
    clearTimeout(touchLongPressTimer);
}

// 使用示例
const touchElement = document.getElementById('touch-long-press-element');

touchElement.addEventListener('touchstart', () => {
    startTouchLongPress(touchElement, () => {
        console.log('触摸长按事件触发');
        // 在这里执行触摸长按事件的回调逻辑
    });
});

touchElement.addEventListener('touchend', cancelTouchLongPress);
touchElement.addEventListener('touchcancel', cancelTouchLongPress);