2. 程式人生 > >點選返回按鈕只能返回某一個 明確的頁面（主要是處理 ios 中 web的）

點選返回按鈕只能返回某一個 明確的頁面（主要是處理 ios 中 web的）

阿新 • • 發佈：2018-12-19

非 ios 下面的一般程式碼如下

pc 端或者 android webview沒有問題， 但是 ios 有問題

history.pushState(null, null, document.URL);
window.onpopstate = function () {
	window.location.href = './A.html';
}

需要做的就是將如下 listenerBackHandler 對應的程式碼copy 進返回的頁面

程式碼展示

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset
 
="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>B page</title>
</head>
<!-- <body onload="myonload()" onpageshow="mypageshowcode()"> -->

<body>
  i am B page <
 
br>
  當前頁面只能返回到 A page
  <a href="./C.html">跳轉到c 頁面</a>
  <br>
  <ol>
    <li>popstate 一般需要當前 document 中存在兩個 url（pushstate）+ 通過 back or forward 來觸發</li>
    <li> chrome 中 只在當前頁面back or forward 觸發</li>
    <li> 微信ios 中 進入和離開當前頁面都會觸發 popstate 事件， 如下案例中 一般會出現 返回的時候跳過 B page</
 
li>
  </ol>
  <script>

    var listenerBackHandler = { // 在返回首頁的時候會有 1s 的bug
      param: {
        isRun: false, //防止微信返回立即執行popstate事件
      },
      listenerBack: function () {
        var state = {
          title: "title",
          url: "#"
        };
        window.history.pushState(state, "title", "#");
        window.addEventListener("popstate", function (e) {
          if (listenerBackHandler.param.isRun) {
            window.location.href = "./A.html"; //返回到主頁
          }
        }, false);
      },
      //初始化返回事件
      initBack: function () {
        window.addEventListener('pageshow', function () {
          listenerBackHandler.param.isRun = false;
          setTimeout(function () { listenerBackHandler.param.isRun = true; }, 1000); //延遲1秒 防止微信返回立即執行popstate事件
          listenerBackHandler.listenerBack();
        });
      }
    };

    listenerBackHandler.initBack();
  </script>
</body>

</html>

詳細程式碼如下連線

參考

相關推薦

點選返回按鈕只能返回某一個 明確的頁面（主要是處理 ios 中 web的）

非 ios 下面的一般程式碼如下 pc 端或者 android webview沒有問題， 但是 ios 有問題 history.pushState(null, null, document.URL)

js點選下載按鈕下載返回的檔案

通過ajax請求獲取返回的檔案url 1、html <button type="button" class="btn btn-primary" id="download_search">下載</button> 2、js $(function(){ //點選下

js點選複製按鈕自動複製連結到文字框（程式碼）

<input size="40" onclick="this.select();" id="zzzz" type="text" value="www.baidu.com" /> <

點擊不同按鈕，加載不同的頁面（不使用iframe的情況下）

lis button sco oos cati 情況 main style pla <button id="button1">Load Html1</button> <button id="button2">Load Html2<

【7.11】為Date類過載“+”運算子，實現在某一個日期上（月、日、年）加一個天數。

#include<iostream.h>  class Date   {      int month;      int day;      int year;  public:     Date(){}      Date(int i)     {day=i;      m

在webview中瀏覽頁面的時候，實現在點選退出按鈕的時候，返回上一頁而不是直接退出

@Override     public boolean onKeyDown(int keyCode, KeyEvent event) {         // TODO Auto-generated method stub         if ((keyCode ==

涉及多個Fragment，點選其中一個fragment中的“點選登入”按鈕，跳轉到“登入”介面時，出現程式閃退現象

問題說明：我想實現從當前fragment_me中點選一下登入按鈕，跳轉到登入介面，所以我在MeFragment.java裡的onCreate()方法中為TextView控制元件新增監聽事件。但在實際執行中，我點選“Me”之後，會出現閃退現象。 錯誤：空指標異常 出現閃

點選新增按鈕--出現一個框框（類似於新增學習經歷-本科-研究生）

import React, { Component } from "react"; class Inner extends Component { defaultValue = { taskDescription: "", vehicleClean: "" }; c

js點選button按鈕跳轉到另一個新頁面

點選按鈕怎麼跳轉到另外一個頁面呢？我們在網站製作中可能是需要的，因為有時我們需要做這樣的效果，尤其是將按鈕做成一個圖片，而點選圖片要跳轉到新的頁面時，怎麼做到呢？ 這樣的效果可以：onclick="window.location='新頁面'" 來實現。 1.在原來的窗體中直接跳轉用 程式碼如下 window

防止點瀏覽器返回按鈕，返回上一頁的JS方法

希望最終停在B頁，不想點B頁瀏覽器返回按鈕，返回到A頁，則在A頁加：<script>    $(document).ready(function(e) {if (window.history && window.history.pushState

Unity中UGUI實現點選改按鈕播放一個音效

專案開發完了，發現了一個問題，雖然不是什麼嚴重的問題不影響遊戲和諧，但是這個再使用者體驗上真的不是很好，什麼問題呢，就是我們的按鈕統一沒有點選音效，這就很尷尬，所以要新增一下，雖然不是什麼很難的功能，但是想了想還是寫個部落格記錄一下過程，以免以後專案中忘記這個功能。 大致再

js如何實現點選一個按鈕顯示一個div，然後該div上有一個按鈕，點選此按鈕後隱藏，隱藏的同時顯示另外一個div，而在次彈出的div也有一個按鈕，點選後隱藏.

<button id="btn1" onclick="btn1()">報名</button> <div id="div1" style="background:#999999; display:none;"> <button id=

element-ui 裡面的按鈕點選以後會有提交的一個轉的載入中的標誌出現在button的字旁邊

點選前 點選後 <el-button type="primary" style="width:100%;" @click.native.prevent="handleSubmit2" :loading="logining">登入</el-button

如何用資料驅動實現通用化巡檢APP（如何一個介面裡新增多個點選拍照按鈕並顯示在不同的imageview裡）

最近啟動了一個新專案叫通用化，老師的設想是這樣的：APP裡顯示的內容和佈局都是不確定的，需要從後臺傳過來的json串中解析出來，然後經過一系列的迴圈和判斷語句，為APP新增上json中要求的佈局和內容，就連文字的大小和顏色也都是從後臺獲取的。 剛開始的時候覺得

Android開發——相簿拍照_03.解決相機拍照之後部分手機無法將圖片儲存到路徑或部分手機點選相機確定無法返回問題

之前用了02的方法，實現了相簿拍照功能，但是在測試的時候發現幾個問題：1.拍完照片之後，返回介面，但是顯示出來的圖片為null，一片空白；2.拍完照片之後，點選相機的確定鍵，無法返回。 因為時間有限，網上的回答很多，第一個問題有人說部分手機沒有SD卡？第二個問

Android 中點選某個按鈕實現 返回鍵 的功能

有時候，我們需要用到返回鍵的功能，但為了美觀，通常我們會將返回鍵放在頁面左上角，這裡我們就需要觸發這個返回鍵的功能才能起到返回的作用，看程式碼吧 backBtn.setOnClickListener(new OnClickListener() { @Ove

點選修改按鈕，將alv某列的不可編輯狀態轉為可編輯狀態

該例子是將YFKJE的欄位的不可編輯屬性修改為可編輯狀態，其實就是將fieldcat的fieldname為YFKJE即這一列，修改其EDIT屬性 LOOP AT fieldcat WHERE

PHP 點選連結更新資料庫,返回值

<a href="javascript:void(0)" title="收藏" class="c-p-n-txt" id='collection_user'>收藏</a> &

HTML5 瀏覽器返回按鈕/手機返回按鈕事件監聽

手機 鎖定 listitem con 按鈕 spa color cnblogs java 1.HTML5 History對象 支持使用pushState()方法修改地址欄地址，而不刷新頁面。 popstate事件 當history實體被改變時，popstate事件將會發生

簡單的側滑實現(點選button按鈕)

第一步： 首先，自己上網上下載一個SlidingMenuLibrary依賴包，將依賴包匯入studio中， 讓自己的專案依賴一下匯入的依賴包，具體流程就不寫了！ activity_main佈局檔案： <?xml version="1.0" encoding="utf-8"?>