## 引入
```html
<link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/toastr.js/latest/css/toastr.min.css">
<script src="https://cdn.bootcss.com/toastr.js/latest/js/toastr.min.js"></script>
```
## 使用
```html
toastr.success('Hello world!', 'Toastr fun!'); /success 、 error、info、warning 第二個參數為標題可以省略
//關閉警告框
toastr.clear([toast]);
//獲取當前警告框
toastr.active();
//刷新警告框 第二個參數為超時時間
toastr.refreshTimer(toast, 5000);
```
## 參數配置
```javascript
toastr.options = {
closeButton: false,
debug: false,
progressBar: true,
positionClass: "toast-top-center",
onclick: null,
showDuration: "300",
hideDuration: "1000",
timeOut: "2000",
extendedTimeOut: "1000",
showEasing: "swing",
hideEasing: "linear",
showMethod: "fadeIn",
hideMethod: "fadeOut" ,
newestOnTop: true,
preventDuplicates: true,
preventOpenDuplicates: true,
maxOpened:1 ，
allowHtml: false,
closeButton: false,
closeHtml: '<button>×</button>',
extendedTimeOut: 1000,
iconClasses: {
error: 'toast-error',
info: 'toast-info',
success: 'toast-success',
warning: 'toast-warning'
},
messageClass: 'toast-message',
onHidden: null,
onShown: null,
onTap: null,
progressBar: false,
tapToDismiss: true,
templates: {
toast: 'directives/toast/toast.html',
progressbar: 'directives/progressbar/progressbar.html'
},
timeOut: 5000,
titleClass: 'toast-title',
toastClass: 'toast'
};
```
說明：
- autoDismiss: true 顯示最新的toastr
- containerId: 默認為"toast-container",設置toastr容器的id名稱.
- maxOpened: 頁面一次性最多顯示多少個toastr.
- newestOnTop: true 新的toastr會顯示在舊的toastr前面
- positionClass: 設置toastr顯示位置的class
- preventDuplicates: true 重復內容的提示框只出現一次，無論提示框是打開還是關閉
- preventOpenDuplicates: true 重復內容的提示框在開啟時只出現一個 如果當前的提示框已經打開，不會多開。直到提示框關閉后，才可再開)
- target: 默認為'body', 設置toastr的目標容器
- allowHtml: 設置提示內容可包含html格式
- closeButton: 設置顯示"X" 關閉按鈕
- closeHtml: 自定義html替代closeButton內容，closeButton為true時才顯示.
- extendedTimeOut: 設置當你鼠標滑入后的timeout，該timeout會更新關閉所需的timeout.
- extraData: 如果重寫模版，你可以自定義全局數據給你的toasts
- iconClasses: 設置各個類型的icon圖標class
- messageClass: 設置toastr提示信息的class
- progressBar: 設置顯示timeout時間進度條
- tapToDismiss: 設置toastr被點擊時關閉
- templates: 自定義模版
- timeOut: 設置toastr過多久關閉
- titleClass: 設置toastr標題的class
- toastClass: 設置toastr基本的class
注意：如果想讓toastr點擊關閉按鈕時才能關閉，可以將“extendedTimeOut”設置為一個很大的數字。