A native implementation of a confirmation dialog.
How to use the confirm interface
AlipayJSBridge.call('confirm', {
title: 'Hello',
message: 'Are you sure you want to exit?',
okButton: 'Yes',
cancelButton: 'No'
}, function(e) {
alert(JSON.stringify(e));
});Code example
Alert and confirm:
<h1>Click the buttons below to see different effects</h1>
<a href="javascript:void(0)" class="btn alert">Click Alert</a>
<a href="javascript:void(0)" class="btn confirm">Click Confirm</a>
<script>
function ready(callback) {
// If jsbridge is already injected, call it directly.
if (window.AlipayJSBridge) {
callback && callback();
} else {
// If not, listen for the injection event.
document.addEventListener('AlipayJSBridgeReady', callback, false);
}
}
ready(function() {
document.querySelector('.alert').addEventListener('click', function() {
AlipayJSBridge.call('alert', {
title: 'Hello',
message: 'Hello',
button: 'OK'
}, function(e) {
e && alert(JSON.stringify(e))
});
});
document.querySelector('.confirm').addEventListener('click', function(){
AlipayJSBridge.call('confirm', {
title: 'Hello',
message: 'Are you sure you want to exit?',
okButton: 'Yes',
cancelButton: 'No'
}, function(e) {
alert(JSON.stringify(e))
});
});
});
</script>API reference
Important
Both confirm and alert are non-blocking. This means if you open two confirmation dialogs in sequence, only the last one is visible.
AlipayJSBridge.call('confirm',{
title, message, okButton, cancelButton
}, fn)Input parameters
Property | Type | Description | Required | Default |
title | string | The title of the alert dialog. | N | "" |
message | string | The text content of the alert dialog. | N | "" |
align | string | The alignment of the message. Valid enumeration values are left, center, and right. | N | iOS: "center" Android: "left" |
okButton | string | The text for the OK button. | N | "OK" |
cancelButton | string | The text for the Cancel button. | N | "Cancel" |
fn | function | The callback function. It is called after a button is clicked. | N | - |