touchstart+定时器是最小可行方案，因html无原生长按事件，需监听touchstart启定时器、touchend/touchcancel清除，延迟500–800ms，须防滑动干扰与内存泄漏。

HTML 原生不支持长按事件，但“长按”在移动手势中是核心交互之一，必须靠手动封装实现，且不能直接复用 click 或 touchend。

为什么 touchstart + 定时器是最小可行方案

移动端浏览器不会触发 contextmenu（长按菜单）以外的原生长按行为，而系统级长按（如选中文本、弹出复制菜单）只对可编辑元素（input、textarea、带 user-select: text 的文本节点）生效。要让任意 div 或按钮响应长按，必须监听 touchstart 启动定时器，并在 touchend / touchcancel 里清除它。

• 定时器延迟建议设为 500–800 ms：太短易误触，太长影响反馈感
• 必须同时监听 touchcancel：手指滑出元素区域或系统中断（如来电）时会触发，漏掉会导致定时器内存泄漏
• 避免在 input[type="text"] 上自行拦截 touchstart 并 preventDefault()：这会阻止软键盘唤起

pointerdown 能替代 touchstart 吗

可以，但需谨慎。pointerdown 是统一事件，覆盖 touch/mouse/pen，且无 300ms 延迟，但它在 iOS Safari 中对非可点击元素（如普通 div）默认不冒泡，且部分安卓 WebView 对 pointer 事件支持不稳定。

Html2md

使用 Readability + Turndown 将 HTML 页面转换为干净的、Agent 友好的 Markdown。去除导航栏、广告、页脚、Cookie 横幅、社交按钮等干扰元素。支持 URL...

下载

• 若目标平台明确支持（Chrome 100+、Edge 100+、Safari 16.4+），可用 pointerdown + pointerup + pointercancel 替代三套事件
• 但 iOS 上 pointerdown 在 contenteditable 区域内可能无法阻止默认选中逻辑，导致与系统长按菜单冲突
• 兼容性兜底仍建议保留 touchstart 分支，尤其面向微信内置浏览器等旧 WebView

如何防止滑动干扰长按判定

用户按住后轻微移动手指很常见，不加过滤会导致长按失败。关键是在 touchmove 中计算位移并取消定时器。

• 记录 touchstart 时的 e.touches[0].clientX/Y
• 在 touchmove 中实时计算偏移量：Math.abs(currentX - startX) > 10 || Math.abs(currentY - startY) > 10
• 一旦超阈值（通常 10 px 足够），立即 clearTimeout(longPressTimer) 并标记“已取消”
• 注意：不要在 touchmove 里调用 preventDefault()，除非你明确接管了滚动——否则会禁用页面原生滚动

长按菜单和原生文本选中的冲突怎么解

当元素既需要自定义长按菜单，又希望保留系统文本选中（比如一个带说明文字的卡片），不能简单禁用 user-select。

• 给容器设 user-select: none，但对内部文本节点单独设 user-select: text
• 在 touchstart 中判断是否点在文本区域：用 document.elementFromPoint(x, y) 拿到目标元素，再检查其 computedStyle.userSelect === "text"
• 只有点在非文本区域时才启动长按定时器；点在文本上则跳过，交由系统处理
• 这个判断必须在 touchstart 阶段完成，touchend 时已晚——系统菜单可能已弹出

真正难的不是写定时器，而是边界条件：手指滑出屏幕、快速连点、WebView 切后台再切回、多指并发……这些都得在 touchcancel 和 visibilitychange 里补全清理逻辑。别省那几行 clearTimeout。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！