禁用 Swiper 轮播图触摸滑动需同时设置 allowTouchMove: false、touchStartPreventDefault: false 和 simulateTouch: false；原生轮播需在容器 touchmove 中调用 e.preventDefault() 并设 passive: false；Bootstrap 5 默认不支持触摸滑动，若可滑动则需检查第三方插件或自定义代码。
swiper 轮播图如何禁用触摸滑动
如果你用的是 Swiper（v6+），默认在移动端启用触摸滑动，要彻底关闭需同时禁用多个交互开关，光设 touchStartPreventDefault: false 不够。
-
allowTouchMove: false—— 关键项，禁用所有触摸移动行为（含拖拽、滑动、惯性） -
touchStartPreventDefault: false—— 防止 touchstart 时阻止默认行为（避免干扰页面内其他滚动） -
simulateTouch: false—— 禁用鼠标模拟触摸（桌面端拖拽也一并关掉） - 顺带建议设
navigation: { enabled: false }或移除导航按钮，否则用户仍可点箭头切换
const swiper = new Swiper('.swiper', {
allowTouchMove: false,
touchStartPreventDefault: false,
simulateTouch: false,
// 其他配置...
});
原生 HTML + CSS + JS 轮播图怎么禁用 touchmove
若没用框架，自己监听 touchstart/touchmove 实现轮播，禁用滑动最直接的方式是在 touchmove 里调用 event.preventDefault() 并返回，但要注意：只阻止轮播容器的事件，别误伤父级滚动区域。
- 给轮播外层容器加
touchmove监听，并立即preventDefault - 确保该容器没有
overflow: scroll或-webkit-overflow-scrolling: touch，否则可能触发双层滚动冲突 - 如果轮播图嵌在
position: fixed或全屏弹层里，还要检查是否被外部body的touchmove: preventDefault影响
document.querySelector('.carousel').addEventListener('touchmove', function (e) {
e.preventDefault();
}, { passive: false });
Bootstrap 5 carousel 禁用触摸滑动
Bootstrap 5 的 carousel 默认不支持触摸滑动 —— 它压根没实现 touchstart/touchmove 逻辑，所以「禁用」其实是默认状态。但如果你发现它能滑，大概率是引入了第三方插件（如 bootstrap-touch-carousel）或自定义 JS 干预了。
- 检查是否加载了额外的 touch 插件脚本，删掉即可
- 确认没手动绑定
touchmove到.carousel元素 - 如果用了
data-bs-touch="true"（某些魔改版 Bootstrap），删掉这个属性 - 浏览器开发者工具里搜
touchmove，看事件监听器来源，比猜更准
为什么设置了 still 能滑？常见漏点
禁用失败往往不是参数写错，而是被更高优先级的行为覆盖或存在隐式启用路径。
立即学习“前端免费学习笔记（深入）”；
-
passive: true是addEventListener默认值，此时preventDefault()无效 —— 必须显式写{ passive: false } - 某些 UI 库（如 Element Plus、Ant Design Mobile）的轮播组件自带内部 touch 处理，得查其文档找
touchable或swipeable属性 - CSS 层面：
touch-action: pan-y或pan-x会接管原生手势，要禁用滑动就得设成touch-action: none - iOS Safari 对
overflow: hidden容器内的 touch 行为有特殊处理，有时需配合-webkit-overflow-scrolling: auto
真正起效前，先用 Chrome DevTools 的「Rendering」面板勾选「Paint flashing」和「Scrolling performance issues」，观察 touch 是否还触发 layout 或 scroll 事件。
