JavaScript監(jiān)聽(tīng)手機(jī)物理返回鍵的兩種解決方法
JavaScript沒(méi)有監(jiān)聽(tīng)物理返回鍵的API,所以只能使用 popstate 事件監(jiān)聽(tīng)。
有兩個(gè)解決辦法:
1、返回到指定的頁(yè)面
pushHistory();
window.addEventListener("popstate", function(e) {
window.location = 'http://www.baidu.com';
}, false);
function pushHistory() {
var state = {
title: "title",
url: "#"
};
window.history.pushState(state, "title", "#");
}
2、js文件方法
此聲明函數(shù)在xback.js文件里有,在app.js里必須再聲明一次,不然監(jiān)聽(tīng)返回事件失敗。
/**
* 使用 HTML5 的 History 新 API pushState 來(lái)曲線監(jiān)聽(tīng) Android 設(shè)備的返回按鈕
* XBack.listen(function(){
alert('oh! you press the back button');
});
*/
;!function(pkg, undefined){
var STATE = 'x-back';
var element;
var onPopState = function(event){
event.state === STATE && fire();
}
var record = function(state){
history.pushState(state, null, location.href);
}
var fire = function(){
var event = document.createEvent('Events');
event.initEvent(STATE, false, false);
element.dispatchEvent(event);
}
var listen = function(listener){
element.addEventListener(STATE, listener, false);
}
;!function(){
element = document.createElement('span');
window.addEventListener('popstate', onPopState);
this.listen = listen;
record(STATE);
}.call(window[pkg] = window[pkg] || {});
}('XBack');
調(diào)用方法:
XBack.listen(function(){
alert('back');
});
總結(jié)
以上所述是小編給大家介紹的JavaScript監(jiān)聽(tīng)手機(jī)物理返回鍵的兩種解決方法,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
js正則表達(dá)式注冊(cè)頁(yè)面表單驗(yàn)證
這篇文章主要為大家詳細(xì)介紹了js正則表達(dá)式注冊(cè)頁(yè)面表單驗(yàn)證,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-10-10
js+html+css實(shí)現(xiàn)鼠標(biāo)移動(dòng)div實(shí)例
移動(dòng)div對(duì)于很多的網(wǎng)有們來(lái)說(shuō)是一件很熟悉的事了,本文老生長(zhǎng)談,用js實(shí)現(xiàn)鼠標(biāo)移動(dòng)div,希望大伙們可以舉一反三,感興趣的朋友可以參考下,或許本文對(duì)你有所幫助2013-01-01
js實(shí)現(xiàn)省市級(jí)聯(lián)效果分享
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)省市級(jí)聯(lián)效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-08-08
js實(shí)現(xiàn)簡(jiǎn)單隨機(jī)抽獎(jiǎng)的方法
這篇文章主要介紹了js實(shí)現(xiàn)簡(jiǎn)單隨機(jī)抽獎(jiǎng)的方法,涉及字符串的操作、setInterval定時(shí)調(diào)用等技巧,需要的朋友可以參考下2015-01-01
js HTML5多圖片上傳及預(yù)覽實(shí)例解析(不含前端的文件分割)
這篇文章主要詳細(xì)解析了js HTML5多圖片上傳及預(yù)覽實(shí)例,不含前端的文件分割,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-08-08
JS實(shí)現(xiàn)數(shù)組去重的11種方法總結(jié)
去重是開(kāi)發(fā)中經(jīng)常會(huì)碰到的一個(gè)熱點(diǎn)問(wèn)題,這篇文章主要介紹了JS中實(shí)現(xiàn)數(shù)組去重的11個(gè)方法總結(jié),文中的示例代碼講解詳細(xì),感興趣的可以了解一下2022-04-04
JavaScript實(shí)現(xiàn)的圓形浮動(dòng)標(biāo)簽云效果實(shí)例
這篇文章主要介紹了JavaScript實(shí)現(xiàn)的圓形浮動(dòng)標(biāo)簽云效果,涉及javascript字符串與數(shù)組的遍歷、排序操作以及元素樣式動(dòng)態(tài)操作與數(shù)學(xué)運(yùn)算等相關(guān)技巧,是非常實(shí)用的一段代碼,需要的朋友可以參考下2015-08-08

