轻松监听任何App自带返回键,使用html5新特性轻松监听任何App自带返回键的示例

动用h5新特色,轻便监听别的App自带再次回到键

2018/07/03 · HTML5 ·
H5

初稿出处:
云叔_又拍云   

应用html五新特色轻巧监听其余App自带再次回到键的亲自去做,html5app

1、前言

于今h5新特色、新标签、新标准等有众多,而且正在不断完善中,各大浏览器商对它们的支撑,也是一对1给力。作为前端技术员,作者以为大家还是有供给积极关切并大胆地加以实践。接下来作者将和各位分享多个特地好用的h伍新特色(如今也不是极度新),轻松监听别的App自带的重回键,包涵安卓机里的物理重回键,从而达成项目开销中更为的必要。

2、起因

粗粗三个月前接收pm一需求,用纯h五兑现多audio的播放、暂停、续播,页面放至驾考宝典App中,与客户端从未任何的相互,所以与客户端相关的js无需引用。看上去这要求挺轻便的呗,即便事先也没做过类似的供给。不管三柒二十一,撸起袖子正是干。开始了深造之旅。

三、作者那边最首要介绍下自家切实是怎么监听其余App自带的重返键,以及安卓机里的物理再次回到键。

那干什么作者要去监听呢,这里本身有不可或缺重申强调再重申。苹果手提式无线电话机无论是微信、QQ、App,照旧浏览器里,涉及到audio、video,重临上1页系统会活动制动踏板当前的广播的,但不是全体安卓机都能够。所以大家和好必须自定义监听。许多相恋的人可能率先主见正是百度,然后出去的答案无非是那样

pushHistory(); 
window.addEventListener("popstate", function(e) { 
    alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能 
}, false); 
function pushHistory() { 
    var state = { 
        title: "title", 
        url: "#"
    }; 
    window.history.pushState(state, "title", "#"); 
}

是或不是很熟悉?但是主要要求不可能完美兑现,要这段代码有啥用,当时本身也是左思右想。直到通过大神好朋友指引,复制了这段代码

var hiddenProperty = 'hidden' in document ? 'hidden' :    
    'webkitHidden' in document ? 'webkitHidden' :    
    'mozHidden' in document ? 'mozHidden' :    
    null;
var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, 'visibilitychange');
var onVisibilityChange = function(){
    if (!document[hiddenProperty]) {    
        console.log('页面非激活');
    }else{
        console.log('页面激活')
    }
}
document.addEventListener(visibilityChangeEvent, onVisibilityChange);

富有标题解决。

这段代码的法则小编个人知道正是通过剖断用户浏览的是不是为当前页,从而进行有关操作。

那是
MDN相关链接:

并不是说真的能够透过JS监听到App里的自带重回键,以致安卓的物理再次回到键,而是经过转移思路,飞速达成供给。希望以此特性能帮到各位。

以上就是本文的全部内容,希望对我们的就学抱有援助,也希望大家多多扶助帮客之家。

壹、前言
近期h五新特点、新标签、新专门的学业等有过多,而且正在不断完善中,各大浏…

1、前言

于今h伍新特色、新标签、新专门的学问等有不少,而且正在不断完善中,各大浏览器商对它们的协助,也是一对一给力。作为前端程序员,小编认为大家依旧有不能缺少积极关怀并大胆地加以推行。接下来作者将和各位分享一个特地好用的h5新本性(近期也不是极度新),轻易监听其余App自带的重临键,包括安卓机里的物理重返键,从而达成项目成本中特别的要求。

2、起因

大概5个月前收到pm1急需,用纯h5实现多audio的广播、暂停、续播,页面放至驾考宝典App中,与客户端从未别的的并行,所以与客户端相关的js没有须要引用。看上去那供给挺简单的呗,即使在此以前也没做过类似的需求。不管三7二拾一,撸起袖子正是干。开头了就学之旅。

发表评论

电子邮件地址不会被公开。 必填项已用*标注