JSAPI

Since 8.1

popTo

You can call popTo to close multiple pages and arrive to a specific page that was opened previously

Note: popTo is only applicable to the pages within the current application, it is not allowed to use popTo to navigate to pages with different appId

Usage

// Close current page
AlipayJSBridge.call('popTo', {
  index: -1
});

Example

Close current page and pass data to resumed page



<h1>Step 2,close current page and pass data to resumed page</h1>
<a href="#" class="btn J_demo">Execute</a>
<script>
function ready(callback) {
  // Invoke directly if JSBridge is already injected
  if (window.AlipayJSBridge) {
    callback && callback();
  } else {
    // Otherwise listen to `AlipayJSBridgeReady` event
    document.addEventListener('AlipayJSBridgeReady', callback, false);
  }
}
ready(function(){
  document.querySelector('a').addEventListener('click', function() {
    // The data will be available in the `resume` event and received in the resumed page 
    AlipayJSBridge.call('popTo', {
      index: -1, // pop up to previous page, error occurs if there is no one
      data: { // data is a dictionary, not an array
        from: location.href,
        info: 'xxxx'
      }
    }, function(e) { 
        // Add callback function as popTo may not be successfully, 
        // i.e., error occurs when there is no previous pages
      alert(JSON.stringify(e));
    });
  });
});
</script>

Navigate to page where URL matches regular expression

<h1>Return to page where URL matches regular expression</h1>
<h3></h3>
<a href="javascript:void(0)" class="btn J_new_window">Open the current page in new window</a>
<a href="javascript:void(0)" class="btn J_demo">Return</a>
<script>
var query = getQuery();
var depth = (+query.depth) || 0;

document.querySelector('h3').innerHTML = 'Current page depth: ' + depth;

function ready(callback) {
  // Invoke directly if JSBridge is already injected
  if (window.AlipayJSBridge) {
    callback && callback();
  } else {
    // Otherwise listen to `AlipayJSBridgeReady` event
    document.addEventListener('AlipayJSBridgeReady', callback, false);
  }
}
ready(function() {
  document.querySelector('.J_demo').addEventListener('click', function() {
    AlipayJSBridge.call('popTo', {
      urlPattern: 'pop-to-url-pattern.html',
    }, function(e) {
      alert(JSON.stringify(e));
    });
  });

  document.querySelector('.J_new_window').addEventListener('click', function() {
    AlipayJSBridge.call('pushWindow', {
      url: location.pathname + '?depth=' + (1+depth),
    });
  });
});
</script>

API

AlipayJSBridge.call('popTo',{
  index, urlPattern
}, fn)

We provide two mutually exclusive query methods, index and urlPattern. Only one method can be accepted in any give time.

Input Parameters

NameTypeDescriptionMandatoryDefaultVersion
indexintThe index number of the target page in the current session stack. If the given number is less than 0, the final value will be the sum of the given number and current page numberY
urlPatternstringThe regular expression pattern to match the URL of the target pageY
fnfunctionThe callback function will be invoked only if popTo call is not successfulN

Output Parameters

NameTypeDescription
resultundefinedOnly use result when popTo call is not successful

Errors

errorDescription
10No parameter given
Invalid index;
No matched urlPattern found;

Remarks

  • Normally popTo is applicable in scenarios where multiple return steps are to be executed in batch.
  • When using urlPattern, the matched page will be the one farthest from the current page, and will not check against with the URL of the current page.
  • Please refer to resume事件 for more details on how the data from popTo is received in resumed page