Mobile Platform as a Service：開啟新頁面

pushWindow 與前端 location.href 的區別，類似於 PC 瀏覽器的新開標籤頁，每個 window 都是一個新的標籤頁，因此原頁面僅僅是被壓到後台，狀態始終保持，JS 也會繼續運行。

pushWindow 介面的使用方法

// 開啟淘寶首頁，自動讀取 title，並且去除右邊功能表按鈕
AlipayJSBridge.call('pushWindow', {
  url: 'https://m.taobao.com/',   // 要開啟頁面的 URL
  // 開啟頁面的配置參數
  param: {
    readTitle: true,              //自動讀取 title
    showOptionMenu: false         // 隱藏右邊菜單
  },
  // 用於給新開的頁面傳遞參數，可選
  // 在新開的頁面使用 AlipayJSBridge.startupParams 可以擷取到 passData
  passData: {
    key1: "key1Value",
    key2: "key2Value"
  }
});

程式碼範例

• 開啟淘寶首頁，去除右邊菜單。

  <h1>開啟淘寶首頁</h1>
  <a class="btn J_demo">執行</a>
  <script>
  function ready(callback) {
    // 如果 jsbridge 已經注入則直接調用
    if (window.AlipayJSBridge) {
        callback && callback();
    } else {
        // 如果沒有注入則監聽注入的事件
        document.addEventListener('AlipayJSBridgeReady', callback, false);
    }
  }
  ready(function(){
    document.querySelector('a').addEventListener('click', function() {
        // 開啟淘寶首頁，自動讀取 title，並且去除右邊菜單
        AlipayJSBridge.call('pushWindow', {
            url: 'https://m.taobao.com/',
            param: {
                readTitle: true,
                showOptionMenu: false
            }
        });
    });
  });
  </script>

• 開啟時設定透明標題列。

  <h1>開啟淘寶首頁</h1>
  <a class="btn J_demo">執行</a>
  <script>
  function ready(callback) {
  // 如果 jsbridge 已經注入則直接調用
  if (window.AlipayJSBridge) {
    callback && callback();
  } else {
    // 如果沒有注入則監聽注入的事件
    document.addEventListener('AlipayJSBridgeReady', callback, false);
  }
  }
  ready(function() {
  document.querySelector('a').addEventListener('click', function() {
    AlipayJSBridge.call('pushWindow', {
      url: 'https://m.taobao.com',
      param: {
        transparentTitle: 'auto'
      }
    });
  });
  });
  </script>

API 說明

AlipayJSBridge.call('pushWindow', {
    url, param, passData
})

入參

param 參數詳解

pushWindow 參數預設繼承

pushWindow 和 location.href 的區別

您可以根據以下內容理解 pushWindow 和 location.href 的區別：

• 首先把 Nebula 容器理解為一個 PC 瀏覽器。

• window 可以理解為標籤頁，location.href 就是正常的標籤跳轉。

• pushWindow 實際上就是新開了一個標籤頁，並且把之前那一頁壓到下面，push 出來的這頁放在頂層展現。此時被壓到下面的上一頁所有狀態均保留。

• location.href 就是依然停留在這個標籤頁，直接做頁面跳轉。

• 當 pushWindow 出來的標籤頁被關閉（pop）時，如果之前還有 window 存在，那麼之前那個 window 就會恢複顯示，並觸發 resume。