有個功能是 Bootstrap modal內有 datepicker input，還有一個 OK按鈕
如果不是按 OK就把 modal關閉的話，modal中輸入欄位的值要還原
如果是按 OK關閉 modal的話，檢核輸入值，檢核未過則 modal取消關閉
搜尋取消關閉 modal的範例後寫出大致如下的程式：
$('.modal').on('hide.bs.modal', function (e) {
if (CheckClosedByBtnOK()) {
if (!ValidInput()) {
e.preventDefault();
e.stopImmediatePropagation();
}
}
else {
ResetInput();
}
});
但是發現使用 datepicker選完日期並關閉小視窗後也會觸發 hide.bs.modal，導致每次選完值就還原，有選跟沒選一樣
Bootstrap modal的官方文件中有說明 events還有一種 hidden.bs.modal，直接拿來套用，改成
$('.modal').on('hidden.bs.modal', function (e) { ...
現在不會選完值就還原了，也就是 hidden.bs.modal只有在 modal關閉時才會觸發，datepicker關閉時不會
但是另一個問題又來了，preventDefault、stopImmediatePropagation現在無效了
因為英文不好，對 Bootstrap modal官方文件的
Events說明琢磨了一會還是看不懂差異在哪：
| hide.bs.modal | This event is fired immediately when the hide instance method has been called. |
| hidden.bs.modal | This event is fired when the modal has finished being hidden from the user (will wait for CSS transitions to complete). |
只好寫程式來觀察：
$('.modal').on('hide.bs.modal', function (e) {
console.log(this);
console.log('hide');
}).on('hidden.bs.modal', function (e) {
console.log(this);
console.log('hidden');
});
得出 hidden.bs.modal是在 modal被關閉後才觸發，所以 preventDefault當然沒有效果
hide.bs.modal是關閉前觸發，但是 modal內的 datepicker關閉時也會觸發 hide.bs.modal
所以改成先判斷 hide.bs.modal是否為 datepicker被關閉時觸發即可
var isUsingDatepicker = false;
$('.modal').on('show.bs.modal', function (e) {
isUsingDatepicker = ($(div.datepicker-dropdown).length > 0);
}).on('hide.bs.modal', function (e) {
if (!isUsingDatepicker) {
if (CheckClosedByBtnOK()) {
if (!ValidInput()) {
e.preventDefault();
e.stopImmediatePropagation();
}
}
else {
ResetInput();
}
}
isUsingDatepicker = ($(div.datepicker-dropdown).length > 0);
});
