对于某些网页,我们使用 iPhone 的左右滑动功能来拉出菜单。 现在,在 iOS7 中,他们引入了通过向左和向右滑动动作来后退和前进浏览器历史记录的上一页和下一页的功能。
但是有没有办法对特定页面禁用它,以免滑动操作出现冲突行为?
不,这是在操作系统级别完成的,网页不会得到任何回调
请参阅 iOS7 中 safari 更改的摘要,这些更改可能会给您的网站带来问题(包括此滑动手势)
您无法直接禁用它,但只有当浏览器历史记录中有某些内容时,才会发生本机向后滑动。
它并非在所有情况下都有效,但如果您在新选项卡中打开了单页 Web 应用程序,则可以使用以下方法阻止它添加到历史记录中:
window.history.replaceState(null, null, "#" + url)
而不是pushState或
document.location.hash = url
1) CSS 仅修复 Chrome/Firefox
html, body {
overscroll-behavior-x: none;
}
2) Safari 的 JavaScript 修复
if (window.safari) {
history.pushState(null, null, location.href);
window.onpopstate = function(event) {
history.go(1);
};
}
随着时间的推移,Safari 将实现
overscroll-behavior-x,我们将能够删除 JS hack
document.body.addEventListener('click', function(evt) {
const a = evt.target.closest('a:not([href^="#"])');
if (!a) { return; }
evt.preventDefault();
history.replaceState({ }, '', a.href);
location.reload();
});
window.addEventListener('touchstart', e => e.preventDefault(), { passive: false })
passive
旗帜很重要!我发现它还会禁用放大镜哦悬停,也许还有其他 Safari 特定的事件。
编辑:此侦听器会中断其他
onclick
事件侦听器的工作...