WeChat や Alipay などのモバイル アプリやブラウザの戻る、戻る、前ページ ボタンを監視するためのイベント メソッドを知らない人はたくさんいます。

実際のアプリケーションでは、ページを閉じたり、指定したページに調整したり、その他の操作を実行したりするために、モバイルアプリやブラウザーの戻る、戻る、前のページなどのボタンをクリックする必要があることがよくあります。

次に、イベントを監視する方法を説明します。 WeChat、Alipay、Baidu Nuomi、Baidu Wallet などのアプリの戻るボタン、またはブラウザの前のページまたは戻るボタンがクリックされたときのコード。

私と同じように、Baidu や Sogou で長い間検索しても方法が見つからなかった友人も多いと思います。監視する方法を説明しましょう:

まず第一に、ブラウザの歴史を理解する必要があります。ご存知のとおり、ページ上で JavaScript ウィンドウ履歴を使用すると、前のページに戻ることができます。ただし、セキュリティ上の理由により、JavaScript は履歴内の既存の URL リンクを変更することはできません。ただし、pushState を使用することはできます。 URL リンクを履歴に追加し、popstate を提供するメソッド。イベント監視は履歴スタックから URL をポップします。 Popstateイベント

モニタリングが提供されているのでモニタリングすることができます。

「戻る」、「戻る」、「前のページ」ボタンのクリック監視の実装コード:

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

戻るイベントを監視しますが、ページは依然として前のページに戻るため、pushState を使用してこのページに URL を追加する必要があります。このページでは、#

function pushHistory() {  
        var state = {  
            title: "title",  
            url: "#"  
        };  
        window.history.pushState(state, "title", "#");  
    }

このページに入ると、この履歴にローカル接続がプッシュされることを誰もがよく知っています。 「戻る」、「戻る」、「前のページ」操作をクリックすると、監視コードで独自の操作を監視して実装することになります。

以下は完全なコードです:

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

注: 一部のコードはオンラインで参照されています。

フォローアップの質問のコレクション:

1. WeChat でページに入ると、popstate イベントがトリガーされます。

解決策: ブール変数 bool=false を定義します。ページが読み込まれた後、setTimeout メソッドを使用してタイムアウトを 1.5 秒に設定し、タイムアウト実行メソッドで bool=true を設定します。

popstate監視にbool判定を追加 bool=trueの場合、内容を実行します。具体的なコードは以下の通りです:

$(function(){  
            pushHistory();  
            var bool=false;  
            setTimeout(function(){  
                  bool=true;  
            },1500);  
            window.addEventListener("popstate", function(e) {  
              if(bool)  
                {  
                        alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能  
                }  
                pushHistory();  
                  
        }, false);  
        });

上記は、あまり知られていないWeChatやAlipayなどのモバイルアプリやブラウザの戻る、戻る、前ページボタンを監視するためのイベントメソッドの内容です。内容については、PHP 中国語 Web サイト (www.php.cn) にご注意ください。