作者Gold740716 (項為之強)
看板Web_Design
標題[問題] 阻止 form 提交？
時間Mon Sep 12 23:48:31 2016
想用 js 處理輸入輸出，
做一個像表單的東西。
但其實不實際用 form 的提交功能，
只用 js 處理後回應，
或 ajax 向 server 發 request 回應。
如果用 form 標籤，
就會向 action="url" 的 url 發出請求，刷新頁面。
但我不想要刷新，
想要留在同一個頁面。
剛查到一個技巧是把 action="
#formSubmit" ，
提交到一個 id ，（甚至也可以是不存在的 id 。）
然後用 hashChange 來偵測。
但這樣會不會有什麼問題？
因為從網址來看應該還是要發出如下請求：
GET
http://domain.name/path/file.html#formSubmit?a=true&b=false
只是因為瀏覽器的實作上，
連到同一個頁面不同 id 不會重新請求。
而且 *提交到一個 id* 也太詭異了 = =|||
要用 post 還是 get ？
## 無關緊要 ###########################
另外我覺得要用 form 有二理由。
1. 語意化，這就是個表單，就該用 form 包起來。
而且不在 form 裡的 input 不會很奇怪嗎？
2. 這不是那麼重要了。
當初我想偵測 enter 輸入，又不想用 keyboard event 。
後來想到用 form 按 enter 會預設提交，
但提交又會刷新，不太好。
後來是把 input 改成 textarea ，
偵測最後一個字元。
達到類似 enter 提交的效果。
--
不要哭。要知道值得你哭的人，不會讓你哭。
別騙人。因為會被你騙的，都是相信你的人。
不要去追。人家神隱，就是不想看見你。
不用和事。當事人吵架，就是想戰。
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 140.116.165.150
※ 文章網址: https://webptt.com/m.aspx?n=bbs/Web_Design/M.1473695320.A.D00.html
1F：推 Ayukawayen: onsubmit裡preventDefault & return false ? 09/12 23:57
2F：推 red0whale: preventDefault 09/13 03:54
3F：推 red0whale: 其實input不一定一定要在form裡面，要用ajax提交資料， 09/13 03:56
4F：→ red0whale: 也不一定要用form包起來 09/13 03:56
5F：→ ssccg: 其實那不是對一個id提交，而是本來html中網址沒有寫完整的 09/13 09:22
6F：→ ssccg: 時候，都會用現有網頁的網址補完 09/13 09:29
7F：推 crossdunk: return false就不會提交了 09/13 11:10
8F：→ crossdunk: 我覺得用form的好處是可以直接用serialize 09/13 11:12
9F：→ bbcust: form本身沒有serialize吧 還是你是說jquery的serialize? 09/13 12:00
10F：推 tsao1211: 可以把原本的submit button type設為button 偵測click e 09/13 12:13
11F：→ tsao1211: vent 然後再自己用js處理 09/13 12:13
12F：推 devil115789: 樓上正解 09/13 15:20
因為如果在 form 裡按了 Enter ，
不少瀏覽器會『自動提交』。
※ 編輯: Gold740716 (140.116.165.150), 09/13/2016 21:36:18
13F：推 tsao1211: 阻止enter提交可以在input 設 onkeypress = "return eve 09/14 02:33
14F：→ tsao1211: nt.keycode != 13;" 09/14 02:33
15F：→ ssccg: 前兩樓不是都說了就是在onsubmit裡面做，不管是用什麼方法 09/14 03:12
16F：→ ssccg: 提交包括button、enter、script submit都會截取到啊.. 09/14 03:13
17F：→ ssccg: 有必要再找別的方法? 09/14 03:13
18F：推 osk2: 一樓正解啊 09/14 07:38