실제 애플리케이션에서는 종종 모바일 앱 및 브라우저의 리턴, 백, 이전 페이지 및 기타 버튼을 클릭하여 페이지를 닫거나 지정된 페이지로 조정하거나 다른 작업을 수행해야합니다. 따라서 WeChat, Alipay, Baidu Nuomi, Baidu 지갑 등과 같은 앱의 반환 버튼을 클릭 할 때 이벤트를 모니터링하는 방법 또는 브라우저의 이전 페이지 또는 뒤로 버튼.
나는 많은 친구들이 나와 같다고 생각합니다. 바이두와 소구에서 오랫동안 검색했지만 방법을 찾지 못한 것 같습니다.
모니터링하는 방법은 다음과 같습니다.
우선, 우리는 브라우저의 역사를 이해해야합니다.
아시다시피, 우리는 페이지에서 JavaScript 창 기록을 사용할 수 있으며 이전 페이지로 돌아갈 수 있습니다. 그러나 보안상의 이유로 인해 JavaScript는 히스토리에서 기존 URL 링크를 수정할 수는 없지만 PushState 메소드를 사용하여 히스토리에 URL 링크를 추가하고 History Stack에서 URL을 팝업하기 위해 PopState 이벤트 모니터링을 제공 할 수 있습니다. PopState 이벤트 모니터링이 제공되므로 모니터링 할 수 있습니다.
버튼을 클릭하여 반환, 뒤로 및 이전 페이지 버튼에 대한 구현 코드를 들으십시오.
window.adeventListener ( "PopState", function (e) {alert ( "브라우저의 반환 버튼 이벤트를 들었습니다"); // 자신의 필요에 따라 자신의 기능을 구현}, false);백 이벤트를 들었지만 페이지는 여전히 이전 페이지로 돌아갑니다. 따라서이 페이지의 URL을 추가하려면 PushState를 사용 하여이 페이지를 나타냅니다. 모두가 #이라는 것을 잘 알고 있습니다.
함수 purphistory () {var state = {title : "title", url : "#"}; window.history.pushstate (state, "title", "#"); }이 페이지에 들어갈 때이 역사에 대한 로컬 연결을 누릅니다. 리턴, 뒷면 및 이전 페이지 작업을 클릭 할 때 듣기 코드에서 자신의 작업을 듣고 구현하십시오.
다음은 전체 코드입니다.
$ (function () {purphistory (); window.addeventListener ( "popstate", function (e) {alert ( "브라우저의 반환 버튼 이벤트를 들었습니다"); // 필요에 따라 자신의 함수를 구현}, false); furting purphistory () {var state = {title : "title :"window. " "#");}});위의 내용은 모든 사람을 위해 편집자가 나열한 핵심 코드입니다. 필요에 따라 코드를 추가, 수정 및 삭제할 수 있습니다. 이 코드를 참조하는 과정에서 질문이 있으시면 메시지를 남겨 주시면 편집자가 제 시간에 모든 사람에게 답장을 드리겠습니다!