http://bootboxjs.com/examples.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="jquery.js"></script>
<script src="bootstrap.min.js"></script>
<script src="bootbox.all.min.js"></script>
<link rel="stylesheet" href="bootstrap.css">
<script>
$(function(){
$("#btn").click(function(){
// alert是只有单个按钮的对话框,按ESC键或单击关闭按钮可关闭对话框。
// bootbox.alert("Your message here…");
// message中可以放html语言,比如:
// bootbox.alert("Your message <b style='color:red'>here…</b>");
// 回调函数:
// bootbox.alert("Your message here…", function(){
// // your callback code
// console.log(11);
// });
// options选项自定义对话框:
// bootbox.alert({
// size: "small",
// title: "Your Title",
// message: "Your message here…",
// callback: function(){
// /* your callback code */
// console.log(22);
// }
// });
// Confirm
// Confirm是具有确定和取消按钮的对话框,按ESC键或单击关闭将忽略对话框
// 并调用回调函数,效果等同于单击取消按钮。
// 需要注意的是,使用confirm时回调函数是必须的。
// bootbox.confirm("Are you sure?", function(result){
// /* your callback code */
// if(result){
// console.log("yes");
// }else{
// console.log("no");
// }
// });
// options选项:
// bootbox.confirm({
// size: "small",
// message: "Are you sure?",
// callback: function(result){
// // result is a boolean; true = OK, false = Cancel
// if(result){
// console.log("yes");
// }else{
// console.log("no");
// }
// }
// });
// Prompt
// Prompt是提示用户进行输入操作并确定或者取消的对话框,按ESC键或单击
// 关闭将忽略对话框并调用回调函数,效果等同于单击取消按钮。
// 同样,prompt中回调函数也是必须的。
// bootbox.prompt("What is your name?", function(result){
// // your callback code
// console.log(result);
// });
// options选项:
// bootbox.prompt({
// size: "small",
// title: "What is your name?",
// callback: function(result){
// // result = String containing user input if OK clicked
// // or null if Cancel clicked
// console.log(result);
// }
// });
// 注意:prompt在使用options选项时需要title选项,并且不允许使用message选项。
// Custom Dialog
// 一个完全自定义的对话框方法,它只接收一个参数 - options对象。
// 也就是说按ESC键时,这个自定义对话框将不会自动关闭,
// 需要使用onEscape函数手动实现此行为。
// options至少要有message选项,这时候将会出现一个不可撤销的对话框,
// 一般用作“loading”界面,如:
// bootbox.dialog(
{ message: '<div class="text-center"><i class="fa fa-spin fa-spinner"></i>
Loading...</div>' });
});
});
</script>
</head>
<body>
<input type="button" value="按钮" id="btn">
</body>
</html>