javascript - 关于站内跳转播放器不中断的解决方案?
PHP中文网
PHP中文网 2017-04-11 11:51:58
0
7
333

功能:需要实现播放器在同一页面内跳转后也不中断音乐,并且前进后退不受影响

现在查询到了pjax可以实现,但是pushState只能够兼容到ie10,ie9就会跳转页面,那么播放肯定中断了。我们项目需要兼容到ie9,想问下还有别的解决方案吗?

PHP中文网
PHP中文网

认证高级PHP讲师

reply all (7)
Peter_Zhu

如果为了播放器不中断,愿意把全站改成SPA应用,用前端路由来解决页面跳转,那绝对是偏执狂了(褒义)

    大家讲道理

    如果在同一个页面显示,是不是可以使用一下AJAX来实现?
    网上有朋友写了一个jquery版跳转切换,可以参考一下

    hostPrefix = "/admin.php"; $(function(){ loadInit(); var isClickLink = false; $("a").click(function(){ isClickLink = true; var nowHref=$(this).attr('href'); if(nowHref[0]=='#'){ var addr= hostPrefix + (nowHref.split("#"))[1]; loadSection(addr); } }); window.onhashchange=function(){ if(isClickLink){ isClickLink = false; }else{ loadInit(); } } if(!(window.onhashchange)){ setInterval(function(){ console.log("Refresh Page."); loadInit(); },2000); } }); function loadInit(){ if(location.hash.split("#")[1]!=undefined){ var loadaddr= hostPrefix + location.hash.split("#")[1]; loadSection(loadaddr); } } function loadSection(addr){ $("#content").html("<h1><center>Loading...</center></h1>"); $.get(addr, {}, function(data){ $("#content").html(data); if(data.status==0){ $("#content").html("<p class=\"alert alert-danger\"><h3>系统错误</h3><p>"+data.info+"</p></p>"); } }).error(function(xhr, info, e){ $("#content").html("<p class=\"alert alert-danger\"><h3>系统错误</h3><p>"+info+"</p>\ <p>Ajax调用状态:"+xhr.readyState+"</p><p>执行状态:"+xhr.status+"</p></p>"); }); }
      小葫芦

      网易云 iframe

        洪涛

        写成单页应用,只要是跳转页面,肯定会间断

          左手右手慢动作

          那就别跳转啊,用前端路由

            阿神

            http://liujians.me/#/

            我的博客使用vue build的、

            上面有一个播放器、切换页面也不会中断、不知道是不是你要的效果

              大家讲道理

              即使非_blank跳转,你的页面也经历了load和unload,页面卸载与加载过程中,不可避免的要中断音乐播放。除非像你说的用pjax无刷新跳转或者干脆单页应用,要不然这个怎么解?我觉得你现在该做的不是怎么实现这个需求,而是衡量效果与收益,然后和产品经理商量。

                Latest Downloads
                More>
                Web Effects
                Website Source Code
                Website Materials
                Front End Template
                About us Disclaimer Sitemap
                php.cn:Public welfare online PHP training,Help PHP learners grow quickly!