小程序内嵌H5打开内部链接,返回手势会直接关闭H5项目

H5里面使用a链接跳转到了一个地址,然后用户在这里浏览,用户执行返回手势之后,其实我是想回到a链接之前的,我的H5页面,但是现在却直接把我H5项目关掉了,我不希望这个样子

解决办法:

如果在H5页面中使用a链接跳转到另一个地址,而在返回手势时直接关闭了整个H5项目,这可能是由小程序 Web-view 组件的默认行为所导致的。可以通过以下方法进行操作:

  1. 使用JavaScript监听浏览器的历史变化(History API):

    在您的H5页面中添加以下JavaScript代码,以便在浏览器后退时阻止Web-view组件直接关闭:

    window.addEventListener('popstate', function (event) {
      if (history.length > 1) {
        history.back();
      }
    });
    
    // 当页面加载时,向history添加一个状态,以便我们可以捕获并处理用户的后退操作。
    window.addEventListener('load', function (event) {
      history.pushState(null, null);
    });

    如此一来,用户通过返回手势后退时,浏览器将只返回至之前的H5页面而非直接关闭整个H5项目。

  2. 在小程序中处理返回按钮事件:
  3. 若小程序允许自定义顶部导航栏及后退按钮,即可在小程序开发中添加逻辑处理,仅在必要时才关闭Web-view组件。具体操作方法需参考您所使用的小程序框架文档。

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值