移动端开发的调试和跳转问题

文章来源

html中加入下面代码

<script src="//cdn.jsdelivr.net/npm/eruda"></script>
<script>eruda.init()</script>

跳转问题

window.open有时在手机端无法跳转

根本原因

1. 由于 window.open 被不少广告商滥用于弹出垃圾广告
2. 所以目前主流浏览器都对 window.open 的执行做了限制

限制后的表现

1. 浏览器只允许在用户明确操作后触发的事件里执行 window.open
2. 不允许在用户无意识的前提下直接打开某个页面

一劳永逸的解决办法

当用户点击后，首先打开一个空的新页面，并且将该页面对象保存

之后执行一个延迟，这里也可以是一个异步操作的回调

< 大专栏   移动端开发的调试和跳转问题p>在 延迟/回调 中在对之前保存的页面对象地址进行修改即可

为了避免某些浏览器将 open 完全禁用，此处需要判断是否为空，为空则只能在当前页面打开期望链接

let open = window.open('about:blank')

if (open === null || typeof(open) === 'undefined') {
  window.location.href = url
  return
}

setTimeout(() => {
  open.location = url
}, 300)