Bootstrap JS Toasts
Toast CSS 类
Toast 组件就像一个警报框，只会在发生某些事件时（例如用户点击按钮、提交表单等）显示几秒钟。
有关 Toast 的教程，请阅读我们的 Bootstrap Toast 教程。
| 类 | 描述 | 示例 |
|---|---|---|
.toast |
创建 Toast | 尝试 |
.toast-header |
创建 Toast 标题 | 尝试 |
.toast-body |
创建 Toast 正文 | 尝试 |
通过 JavaScript 激活
Toast 必须使用 jQuery 初始化：选择指定的元素并调用 toast() 方法。
Toast 选项
选项可以通过数据属性或 JavaScript 传递。对于数据属性，将选项名称附加到 data-，例如 data-animation=""。
| 名称 | 类型 | 默认值 | 描述 | 尝试 |
|---|---|---|---|---|
| animation | 布尔值 | true |
指定是否在显示和隐藏 Toast 时添加 CSS 淡入淡出过渡效果。
|
尝试 |
| autohide | 布尔值 | true | 指定是否默认隐藏 Toast | 尝试 |
| delay | 数字 | 500 | 指定 Toast 显示后隐藏所需的时间（毫秒）。 | 尝试 |
Toast 方法
下表列出了所有可用的 Toast 方法。
| 方法 | 描述 | 尝试 |
|---|---|---|
| .toast(options) | 使用选项激活 Toast。有关有效值，请参见上面的选项。 | 尝试 |
| .toast("show") | 显示 Toast | 尝试 |
| .toast("hide") | 隐藏 Toast | 尝试 |
| .toast("dispose") | 隐藏并销毁 Toast | 尝试 |
Toast 事件
下表列出了所有可用的 Toast 事件。
| 事件 | 描述 | 尝试 |
|---|---|---|
| show.bs.toast | Toast 即将显示时发生 | 尝试 |
| shown.bs.toast | Toast 完全显示后发生（在 CSS 过渡完成后） | 尝试 |
| hide.bs.toast | Toast 即将隐藏时发生 | 尝试 |
| hidden.bs.toast | Toast 完全隐藏后发生（在 CSS 过渡完成后） | 尝试 |
