經過實作後，情境如下

1. 打開表單頁面，在沒有點擊任何輸入元素的情況下，直接關閉此瀏覽器的分頁。這時候不會詢問是否要儲存。
2. 打開表單頁面，點擊任何輸入元素，會被瀏覽器視為已修改，此時關閉瀏覽器的分頁，會詢問是否要儲存。
3. 按下儲存按鈕，然後關閉瀏覽器分頁，這時候應該直接關閉，不詢問。
4. 在按下儲存按鈕之後，如果又點擊任何輸入元素(或是修改)，然後關閉瀏覽器的分頁，要詢問是否要儲存。

儲存按鈕
<button type="submit" id="btn-save-form" form="myform" title="Save" class="btn btn-primary"></button>

  //創建一個自訂函數
  function myBeforeUnload(event){
    // Cancel the event as stated by the standard.
    event.preventDefault();
    // Chrome requires returnValue to be set.
    event.returnValue = '';
  }
  
  //頁面載入後，使用監聽事件的方式去呼叫該函數
  window.addEventListener('beforeunload', myBeforeUnload);
  
  //點擊儲存按鈕之後，取消監聽事件
  $('#btn-save-form').on('click', function(){
    window.removeEventListener('beforeunload', myBeforeUnload);
  });
  
  //若在 input 元素觸發 focusin (滑鼠點入)，則新增監聽事件
  $("input").focusin(function() {
    window.addEventListener('beforeunload', myBeforeUnload);
  });

• 聽說在 ios10 會有問題，但之後的可以。
• 聽說 ios 不支持 beforeunload, 要用 pagehide。
• 好像可以改用 popstate https://www.youtube.com/watch?v=PncjPTjHUWw

歡迎補充 ios 的做法以及優化…

window.removeEventListener with a named function isn't working
https://stackoverflow.com/questions/38223945/window-removeeventlistener-with-a-named-function-isnt-working

坑啊 ios已经废弃beforeunload事件
https://blog.csdn.net/fighting_sunnyGirl/article/details/103407617