永利澳门游戏网站:使用html5新特性轻松监听任何App自带返回键的示例,轻松监听任何App自带返回键

应用h5新特点,轻便监听其余App自带重返键

2018/07/03 · HTML5 ·
H5

原稿出处:
云叔_又拍云   

动用html5新特色轻巧监听别的App自带重回键的示范,html5app

1、前言

目前h5新性格、新标签、新标准等有成千上万,并且正在不断完善中,各大浏览器商对它们的协助,也是一定给力。作为前端程序员,小编以为大家照旧有不可或缺积极关切并勇敢地加以实行。接下来作者将和各位分享贰个特意好用的h5新特色(近年来亦不是专程新),轻易监听别的App自带的重回键,包罗安卓机里的物理重返键,进而完成项目开垦中进一步的须要。

2、起因

粗粗7个月前收到pm一要求,用纯h5落到实处多audio的播报、暂停、续播,页面放至驾考宝典App中,与客商端从未另外的交互,所以与客户端相关的js无需引用。看上去那要求挺简单的呗,尽管在此之前也没做过类似的急需。不管三七二十一,撸起袖子正是干。早先了学习之旅。

3、小编那边根本介绍下本身实际是怎么监听其余App自带的重返键,以及安卓机里的物理再次回到键。

那干什么笔者要去监听呢,这里作者有要求强调重申再重申。苹果手提式有线电话机无论是微信、QQ、App,如故浏览器里,涉及到audio、video,再次回到上一页系统会活动行车制动器踏板当前的播音的,但不是装有安卓机都足以。所以我们团结必得自定义监听。很多有情侣概率先主见正是百度,然后出来的答案无非是那样

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里的自带重临键,以致安卓的物理再次来到键,而是经过变化思路,飞速达成须求。希望那本天性能帮到各位。

以上正是本文的全体内容,希望对我们的求学抱有利于,也愿意大家多多照应帮客之家。

1、前言
前段时间h5新性情、新标签、新职业等有众多,何况正在不断完善中,各大浏…

1、前言

今昔h5新性格、新标签、新职业等有为数不菲,並且正在不断完善中,各大浏览器商对它们的支持,也是一定给力。作为前端技士,小编感觉大家依然有不可或缺积极关心并勇敢地加以实践。接下来笔者将和各位分享三个相当好用的h5新特征(近些日子亦非专门新),轻便监听其余App自带的再次回到键,满含安卓机里的物理重返键,进而达成项目开拓中尤为的急需。

2、起因

差相当少六个月前收到pm一急需,用纯h5落到实处多audio的播报、暂停、续播,页面放至驾考宝典App中,与顾客端从未其余的相互,所以与客商端相关的js不须要援引。看上去那须要挺轻巧的嘛,即使事先也没做过类似的要求。不管三七二十一,撸起袖子正是干。发轫了学习之旅。

发表评论

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