form表單 回車 送出問題

我們有時候希望Enter鍵敲在文本框（ input element ）裡來送出表單（ form ），但有時候又不希望如此。比如搜尋行為，希望輸入完關鍵詞之後直接按Enter鍵立即送出表單，而有些複雜表單，可能要避免Enter鍵誤操作在未完成表單填寫的時候就觸發了表單送出。

要控制這些行為，不需要借助 JS ，浏覽器已經幫我們做了這些處理，這裡總結幾條規則：

   1. 如果表單裡有一個 type=”submit” 的按鈕，Enter鍵生效。

   2. 如果表單裡隻有一個 type=”text” 的 input ，不管按鈕是什麼 type ，Enter鍵生效。

   3. 如果按鈕不是用 input ，而是用 button ，并且沒有加 type ， IE 下預設為 type=button ， FX 預設為 type=submit 。

   4. 其他表單元素如 textarea 、 select 不影響， radio checkbox 不影響觸發規則，但本身在 FX 下會響應Enter鍵，在 IE 下不響應。

   5. type=”image” 的 input ，效果等同于 type=”submit” ，不知道為什麼會設計這樣一種 type ，不推薦使用，應該用 CSS 添加背景圖合适些。

6. 我們在處理表單的頁面可以檢驗他是否點選了按鈕來控制下面的程式。 if($_POST['submit']){ 如果點選了按鈕 程式繼續 }

實際應用的時候，要讓表單響應Enter鍵很容易，保證表單裡有個 type=”submit” 的按鈕就行。而當隻有一個文本框又不希望響應Enter鍵怎麼辦 呢？我的方法有點别扭，就是再寫一個無意義的文本框，隐藏起來。根據第 3 條規則，我們在用 button 的時候，盡量顯式聲明 type 以使浏覽器表現一緻。

通過以上可知隻要把 type="submit" 改成 type="button" 然後 js 送出， 在不要有一個 type=”text” 的 input 就行了。就不會發生回車跳轉。

但實驗發現， ie 和火狐不一樣，火狐的 submit 按鈕有掩藏的（ display ： block ）和顯現的都不行，必須全改，但 ie 隻要顯現的沒有 submit 就行了。