離奇表單自動提交事件

前言

表單在網頁設計上是很常使用的元素，通常會包含著讓使用者輸入的文字欄位和提交（submit）表單的按鈕。但是不知道為什麼手上的案子的設計，會利用 JavaScript 來取得值再去做 POST 的動作，而又有另一個動作是會做傳統的提交表單動作，可是因為有一個文字輸入欄位是再點選文字後才會出現，且是用來即時修改資料使用，會配合 blur 事件和 Ajax 來修改資料，而有時候使用者會很自然的在編輯完後按下 Enter 來表示修改完成，這時候卻會觸發表單的提交事件，但是卻又不是每一次都會發生，最後終於找到真正的原因...

說明

表單設計上，規劃了一些情境來說明發現的問題：

表單裡面只放置了一個文字欄位，此時在文字欄位按下 Enter 便會送出表單。

表單裡面放置了兩個文字欄位，此時在文字欄位按下 Enter 不會送出表單。

此時想要按下 Enter 也會送出表單只需要放上一個提交按鈕就好了。

結論

有時候設計上可能會利用 JavaScript 來檢查表單再去做送出表單的動作，可能就會沒有設計提交的按鈕，加上資料又是從資料庫所產生出來，就有機會遇到這樣類似的情形，因為是很簡單的東西，卻是很有可能忽略就會發現怎麼會產生這樣的怪問題，特此記錄一下此次遇到的簡單怪事件。