精华内容
下载资源
问答
  • 微信页面监听返回事件
    2021-09-09 10:36:34
    $(function(){
    		pushHistory();
            window.addEventListener("popstate", function(e) {
                //alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能
                //alert('guanbi');
                WeixinJSBridge.call('closeWindow');
                if(typeof(WeixinJSBridge)!="undefined"){
                        WeixinJSBridge.call('closeWindow');
                    }else{
                        if (navigator.userAgent.indexOf("MSIE") > 0) {  
                            if (navigator.userAgent.indexOf("MSIE 6.0") > 0) {  
                                window.opener = null; window.close();  
                            }  
                            else {  
                                window.open('', '_top'); window.top.close();  
                            }  
                        }  
                        else if (navigator.userAgent.indexOf("Firefox") > 0) {  
                            window.location.href = 'about:blank ';  
                            //window.history.go(-2);  
                        }  
                        else {  
                            window.opener = null;   
                            window.open('', '_self', '');  
                            window.close();  
                        }
                    }
            }, false);
            window.onbeforeunload = function() {
                    return;
                } 
            function pushHistory() {
                var state = {
                    title: "title",
                    url: ""
                };
                window.history.pushState(state, "title", "");
            }
        });
    

    更多相关内容
  • 监听微信返回按钮

    2021-01-17 13:09:32
    场景一:直接进入一个A页面,然后点击微信返回按钮代码如下:window.addEventListener("popstate", function(e) {WeixinJSBridge.call('closeWindow');}, false);预期:关闭页面,跳回进入之前的微信界面实际结果:...

    a.场景一:直接进入一个A页面,然后点击微信返回按钮

    代码如下:

    window.addEventListener("popstate", function(e) {

    WeixinJSBridge.call('closeWindow');

    }, false);

    预期:关闭页面,跳回进入之前的微信界面

    实际结果:现象如预期,但是并没有监听到popstate。

    原理:当浏览器做出动作导致历史记录发生变化时,才会触发popstate事件。

    b.场景二:直接进入A页面,然后A页面中自动$state.go跳转到子页面B中,在B页面中点返回

    代码如下:在父页面A中写入

    window.addEventListener("popstate", function(e) {

    WeixinJSBridge.call('closeWindow');

    }, false);

    预期:回到微信页面

    实际结果:页面加载完B页面之后直接退回到微信页面

    修改:增加标识位isFirst防止页面加载时history改变触发popstate

    修改后代码如下:

    $scope.isFirst=true;

    window.addEventListener("popstate", function(e) {

    if(!$scope.isFirst){

    WeixinJSBridge.call('closeWindow');

    }else{

    $scope.isFirst=false;

    }

    }, false);

    c.场景三:首先进入A页面,然后在A页面中通过window.location跳转到页面B,在B页面中点返回

    代码如下:

    window.addEventListener("popstate", function(e) {

    WeixinJSBridge.call('closeWindow');

    }, false);

    预期:能进入监听,且成功返回微信页面

    实际结果:触发监听,但返回A页面

    修改代码后:

    function pushHistory() {

    var state = {

    title: "title",

    url: "#"

    };

    //state:与指定网址相关的状态对象,popstate事件触发时,该对象会传入回调函数 window.history.pushState(state, "title", "#");

    //添加这个记录之后,浏览器地址变为最新的地址,即在原先的URL末位加#,且history.length加1,浏览器后退返回原来的URL,页面内容不变}

    pushHistory();

    window.addEventListener("popstate", function(e) {

    WeixinJSBridge.call('closeWindow');

    }, false);

    修改原理:因为popstate的监听原理是在做出浏览器动作时,才会触发,但是页面还是会返回到上一个页面,无法在B页面代码中操作。因此需要使用pushState增加一个本页的url,代表本页,用window.history.pushState给history压入一个本地的链接,当点击返回时,就进行监听,在监听代码中实现自己操作。

    注意:调用history.pushState()或history.replaceState()不会触发popstate事件,只有在做出浏览器动作时,才会被触发,比如点击浏览器的返回按钮或者用JS调用history.back()等

    展开全文
  • 监听微信返回

    千次阅读 2021-01-17 13:09:27
    在做微信公众号页面开发里,触发微信返回事件的时候有2个需求。我现在大概的页面流程是页面a->...监听返回事件可以利用history+popstate实现。监听页面a是不是从上个页面返回来的可以使用 wi...

    在做微信公众号页面开发里,触发微信返回事件的时候有2个需求。

    我现在大概的页面流程是页面a->页面b,在页面b操作数据,在页面b点击返回,会回到a页面并刷新。在页面a点击返回,直接退回到公众号页面。

    所以我需要监听2个事件。1是监听a页面的返回事件,2是判断页面a是不是从上个页面返回来的。

    监听返回事件可以利用history+popstate实现。

    监听页面a 是不是从上个页面返回来的可以使用 window.performance.navigation.type 实现。

    a页面的主要代码如下:

    $(function() {

    let pushStateBool = false;

    //判断用户是不是通过后退按钮访问本页面的

    window.addEventListener('pageshow', function() {

    pushStateBool = false;

    setTimeout(function() {

    pushStateBool = true;

    }, 1000) //延迟1秒 防止ios微信返回立即执行popstate事件,文末有解释

    pushHistory();

    if (event.persisted || window.performance && window.performance.navigation.type == 2) {

    //刷新当前页面

    window.location.reload()

    }

    })

    //监听返回按钮事件

    window.addEventListener("popstate", function(e) {

    if (pushStateBool) {

    //返回直接到公众号主页

    WeixinJSBridge.call('closeWindow');

    }

    pushHistory();

    },

    false

    );

    function pushHistory() {

    let state = {

    title: "",

    url: "#"

    };

    window.history.pushState(state, "我的钱包", "#");

    }

    });

    实现原理:

    window.performance.navigation.type包含三个值:

    0 : TYPE_NAVIGATE (用户通过常规导航方式访问页面,比如点一个链接,或者一般的get方式)

    1 : TYPE_RELOAD (用户通过刷新,包括JS调用刷新接口等方式访问页面)

    2 : TYPE_BACK_FORWARD (用户通过后退按钮访问本页面)

    关于IOS微信返回立即执行popstate事件原因:

    因为在IOS微信浏览器里,返回上一个页面时,必定会触法popstate事件,就会导致立即返回到公众号。

    通过pageshow事件先延迟1秒的事件,让执行popstate事件时无法返回,等定时器把pushStateBool的值改成true,然后再点击返回按钮,就会再次执行popstate事件,就可以执行你想要的操作了。

    参考博客:

    展开全文
  • #微信公众号,用户监听用户点击返回 在手机微信开发者工具中可以触发,但是在手机上需要该页面进入两次以上才会触发,表示一脸懵逼 需要解决的问题就是,在用户在不同页面来回切换是,用户返回上一页会出现频繁切换 ...

    #微信公众号,用户监听用户点击返回
    在手机微信开发者工具中可以触发,但是在手机上需要该页面进入两次以上才会触发,表示一脸懵逼
    需要解决的问题就是,在用户在不同页面来回切换是,用户返回上一页会出现频繁切换

    $(document).ready(function(e) {
        var counter = 0;
        if (window.history && window.history.pushState) {
            $(window).on('popstate', function () {
                window.history.pushState('index', null, '#');
                window.history.forward(1);
                window.location="{:url('')}";
            });
        }
        window.history.pushState('index', null, '#');
        window.history.forward(1);
    });
    
    
    展开全文
  • 前端时间做微信抢红包h5开发的时候,跳转了几个页面,但...// 监听微信返回 window.addEventListener("popstate", function(e) { alert('正在返回,等下会关闭微信窗口'); WeixinJSBridge.call('clo...
  • JS监听微信浏览器返回事件

    千次阅读 2019-04-24 09:46:08
    监听popstate事件,这个对应着微信浏览器左上方后退按钮。(用得最多) // 添加退后事件 window.addEventListener('popstate', () => { ...... // do something ......for example // location.href =...
  • js监听微信浏览器返回按钮事件

    千次阅读 2019-01-08 15:44:47
    pushHistory(); window.addEventListener("popstate", function(e) { alert("好嗨哟,感觉到达了人生巅峰!");//根据自己的需求实现的功能 }, false);... function pushHistory() { ...
  • 最近在进行企业微信相关的开发,系统要上线必须满足企业微信那边的一个要求:部分页面(单据填写页等)要求必须对接JS-SDK监听页面返回事件,在用户返回上个页面时,回调开发者注册的函数,处理业务需要的逻辑。...
  • 问题描述1:微信开发的时候,在公众号菜单中打开一个H5页面(如:个人中心),在这个页面上的一些操作,经过多次跳转后,点击左上角的返回按钮,发现会原封不动的返回至上一级页面。即 公众号菜单->A->B->C,...
  • 微信返回按钮监听

    2022-01-12 11:25:01
    $(document).ready(function(e) { var counter = 0; if (window.history && window.history.pushState) { $(window).on('popstate', function () { window.history.pushState('index', null, '#');
  • js监听微信返回按钮

    千次阅读 2018-01-05 17:13:50
    现在有三个HTML页面:A->B->C 用户在C页面时,我们希望用户直接返回到A页面时,可以添加如下代码 $(function() { pushHistory(); window.addEventListener("popstate", function(e) { window.locati
  • JavaScript没有监听物理返回键的API,所以只能使用 popstate 事件监听。接下来通过本文给大家分享JavaScript监听手机物理返回键的两种解决方法,感兴趣的朋友一起看看吧
  • 返回上一页,即退出报名页,这里监听了物理返回,确定才正式返回上一页 以上功能在安卓和ios上测试都通过 代码 methods windowListener() { let that = this; if(this.userEditType == 1 && this....
  • 我们常常需要实现在移动app和浏览器中点击返回、后退、上一页等按钮实现自己的关闭页面、调整到指定页面或执行一些其它操作的需求,那在代码中怎样监听当点击微信、支付宝、百度糯米、百度钱包等app的返回按钮或者...
  • 背景:项目中有一个场景要监听android手机物理返回键,但是app和js的中间件又没提供这个事件的监听,只能百度纯js实现了 第一步: xback.js ;!function(pkg, undefined){ var STATE = 'x-back'; var element; ...
  • 监听微信返回按钮事件

    千次阅读 2017-09-24 11:29:47
    开发很多时候针对不同的机型会有不同的...如何监听微信返回按钮的点击事件,请看以下代码: $(function(){ //监听浏览器返回的事件 pushHistory(); window.addEventListener("popstate", function(e) { WeixinJ
  • ``` window.onhashchange = ...以上两种方法监听手机物理返回键都试过了 也试过先进另一个页面然后跳转到这个页面 第一个页面都没有监听到,但是在页面任意位置点击后生效了 大佬们有什么解决办法吗
  • 微信监听返回按钮

    2017-12-20 14:38:00
    JavaScript加入这个就无法返回 $(function(){ function pushHistory() { var state = { title: "title", url: "#" }; window.history.pushState(state, "title", "#")...
  • 1、当网页第一次进入该页面时,能监听返回或者网页后退,但是后面再进入该监听页面时,不进行任何操作时只能监听到网页后退,不能监听到手机返回返回(荣耀手机测试),必须要点击页面上的内容才能监听到手机...
  • vue.js代码,安卓手机和ios,在微信浏览器点击返回按钮或手机自带的返回,都会直接关闭微信浏览器,返回到公众号主体 const pushHistory = () => {  let state = {  title: 'myCenter',  url: '__SELF__'  }  ...
  • window.addEventListener(...// alert(“我监听到了浏览器的返回按钮事件啦”); if(this.location.href.endsWith("#/")){ //设置那个页面 WeixinJSBridge.call(‘closeWindow’);//关闭页面 } }, false); ...
  • 移动端微信浏览器监听物理返回

    千次阅读 2019-10-21 09:48:08
    移动端监听物理返回监听物理返回键Android微信浏览器 起因:项目需求 移动端H5页面点击返回键,弹出广告弹屏,关闭广告弹屏后,ios端禁止点击返回键,Android端再次点击返回返回上一界面 监听物理返回键参考文章...
  • $(function(){ pushHistory(); window.addEventListener("popstate", function(e)... //alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能 //alert('guanbi'); WeixinJSBridge.cal...
  • 信公众号开发的时候,可能会出现这种需求: 微信公众号内指定某个网页...解决方案:利用监听返回事件window.addEventListener("popstate", function(e) {//你的逻辑}, false); 所以只需在页面调用 onBackCloseWin...
  • 微信小程序 监听手势滑动切换页面实例详解 1.对应的xml里写上手势开始、滑动、结束的监听: <view class=touch bindtouchstart=touchStart bindtouchmove=touchMove bindtouchend=touchEnd></view> 2.js: var ...
  • $(function () { function pushHistory() { var state = { title: "title", url: "#" ... //alert("监听到了返回事件"); $(window).attr('location','lastPage.html'); }, false); })  
  • document.referrer是javascript提供的默认返回并刷新页面的方法;同时用document.referrer可以获取到上一个页面的url; 那么具体如何使用呢? 举个列子:我们在做商城的时候,会有地址列表页;如下图地址列表页,...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 14,486
精华内容 5,794
关键字:

js微信监听返回