h5頁面,瀏覽器不讓返回,app不讓返回。

環境:有一次開發中遇到這樣的一個需求。但是後面卻沒有上先。

在一個H5頁面,讓瀏覽器與APP不能返回這個頁面,類似於一個噁心的廣告頁面

 

代碼:

    XBack = {};
    (function(XBack) {
        XBack.STATE = 'x - back';
        XBack.element;
        XBack.onPopState = function(event) {
            event.state === XBack.STATE && XBack.fire();
            XBack.record(XBack.STATE); //初始化事件時,push一下
        };
        XBack.record = function(state) {
            history.pushState(state, null, location.href);
        };
        XBack.fire = function() {
            var event = document.createEvent('Events');
            event.initEvent(XBack.STATE, false, false);
            XBack.element.dispatchEvent(event);
        };
        XBack.listen = function(listener) {
            XBack.element.addEventListener(XBack.STATE, listener, false);
        };
        XBack.init = function() {
            XBack.element = document.createElement('span');
            window.addEventListener('popstate', XBack.onPopState);
            XBack.record(XBack.STATE);
        };
    })(XBack); // 引入這段js文件
    XBack.init();
    XBack.listen(function() {});

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章