Prompts a toast notification, its display duration is configurable. Note for Android platform, this API is not effective if user has disabled the system notification.
AlipayJSBridge.call('toast', {
content: 'Success',
type: 'success',
duration: 2000
}, function() {
alert("Execute when toast dismisses");
});
// You can also manually hide the toast via hideToast API
AlipayJSBridge.call('hideToast', {}, function() {
});
<h1>Please click the following buttons</h1>
<a href="javascript:void(0)" class="btn success">Display success</a>
<a href="javascript:void(0)" class="btn fail">Display failure</a>
<a href="javascript:void(0)" class="btn exception">Display exception</a>
<a href="javascript:void(0)" class="btn none">Display message</a>
<a href="javascript:void(0)" class="btn duration">Display toast for 3.5 seconds</a>
<script>
function toast(config, callback){
AlipayJSBridge.call('toast',config, callback);
}
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('.success').addEventListener('click', function() {
toast({
content: 'Success',
type: 'success'
});
});
document.querySelector('.fail').addEventListener('click', function() {
toast({
content: 'Network busy, please try again later',
type: 'fail'
});
});
document.querySelector('.exception').addEventListener('click', function() {
toast({
content: 'Exception occurs',
type: 'exception'
});
});
document.querySelector('.none').addEventListener('click', function() {
toast({
content: 'Welcome',
});
});
document.querySelector('.duration').addEventListener('click', function() {
toast({
content: 'Please wait',
duration: 3500,
}, function(e) {
alert('Callback when toast dismisses');
});
});
});
</script>
AlipayJSBridge.call('toast', {
content, type, duration
}, fn)
| Name | Type | Description | Mandatory | Default | |
|---|---|---|---|---|---|
| content | string | Text content of this toast | Y | ‘’ | |
| type | string | Available options: none / success / fail / exception | N | ‘none’ | |
| duration | int | Display duration, in milliseconds | N | 2000 | |
| xOffset | float | right to left by px | N | 0 | 10.0.15 |
| yOffset | float | bottom to top by px | N | 0 | 10.0.15 |
| fn | function | Callback function, invoked when toast dismisses | N |
toast dismisses after a certain duration, you can manually dismiss it by calling hideLoading API.