移动端(一体机)iframe视频播放时按返回键时会将视频携带回去

13 篇文章 0 订阅
3 篇文章 0 订阅
在移动端的时候(特别是在一体机上–android系统),iframe视频播放时按返回键时会将视频携带回去,就导致了用户的体验很不好。导致这个原因是因为视频播放时,在android上是全屏播放,导致视频脱离了原先的文档流,所以在返回时就直接携带过去了。
个人原先思考的方向:
能不能再监听手机返回事件时将该页面刷新后再强制返回到上一页面,结果就导致在该页面到首页的一系列的返回之路上就必须全都写死,而且在首页返回时得禁止掉返回事件,这样的结果在微信端上的体验会很僵硬了,且在首页返回时返回不了(写死禁止了)。
脱离文档流的启发
既然之前的方法行不通,也一直在纠结文档流这个问题(原谅一个小白的辛苦)。就想着在返回的时候将这个脱离文档流视频移除掉,这样就不会携带过去了!下面是完整代码
$(function(){
        pushHistory();
        window.addEventListener("popstate", function(e) {
            $("iframe").remove();
            setTimeout(function () {
                window.history.go(-1);
            },100);
        }, false);
        function pushHistory() {
            var sta = {
                title: "title"
            };
            if( window.history.state === null )
            {
                window.history.pushState( sta, "title" );
            }
        }
    });
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值