This interface is used to set the title bar of the page, including main title, subtitle, and menu items of the title.
Note: Due to Apple’s ATS restrictions, the image URL must be either an HTTPS link or base64. HTTP links will be ignored.
Use setTitle interface
AlipayJSBridge.call('setTitle', {
title: 'Title',
});
Code example
Set up title bars:
<h1>Click the buttons below to see the different effects</h1>
<a href="javascript:void(0)" class="btn title">Only set the title</a>
<a href="javascript:void(0)" class="btn subTitle">Title + subtitle</a>
<a href="javascript:void(0)" class="btn clear">Clear the title</a>
<script>
function ready(callback) {
// Call directly if JSBridge has been injected
if (window.AlipayJSBridge) {
callback && callback();
} else {
// Monitor the injected events if JSBridge hasn't been injected
document.addEventListener('AlipayJSBridgeReady', callback, false);
}
}
ready(function(){
document.querySelector('.title').addEventListener('click', function() {
AlipayJSBridge.call('setTitle', {
title: 'Title'
});
});
document.querySelector('.subTitle').addEventListener('click', function() {
AlipayJSBridge.call('setTitle', {
title: 'Title',
subtitle: 'Subtitle'
});
});
document.querySelector('.clear').addEventListener('click', function() {
AlipayJSBridge.call('setTitle', {
title: ' ',
subtitle: ' ',
});
});
});
</script>
API
AlipayJSBridge.call('setTitle',{
title, subtitle, image
}, fn)
Input parameters
Name | Type | Description | Required | Default value | Version |
---|---|---|---|---|---|
title | string | Main title text | N | ||
subtitle | string | Subtitle text | N | ||
image | string | Supports URL or base64. Please use a 3X image. If you’ve set an image, the first two parameters will be invalid, and the title will not be read from the webview callback |
N | 9.9.5 |
Attentions
Empty title is not supported before Android 10.0.18, but it can be instead by setting an invisible string. This restriction has been removed since version 10.0.20.
AlipayJSBridge.call('setTitle', {
title: '\u200b',
});