javascript - 关于站内跳转播放器不中断的解决方案？

Question

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

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

Answer 1

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

Answer 2

如果在同一个页面显示，是不是可以使用一下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>");
    });
}

Answer 3

网易云 iframe

Answer 4

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

Answer 5

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

Answer 6

http://liujians.me/#/

我的博客使用vue build的、

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

Answer 7

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