Web程序中,用戶通過提交按鈕submit把表單form中的數據提交給服務器進行處理。如果服務器處理的時間較長,或者網絡速度較慢,瀏覽器在提交以 后,就會產生一段時間的等待。對於某些工作比較節奏很快的用戶來說,這種等待打亂了工作節奏,不堪忍受。用戶等了一秒鍾,看到頁面沒有反映,就會再次點提 交按鈕,又等了一秒鍾,再次提交,如此反復。
對於這種重復提交,就可能產生一些性能問題甚至錯誤。
例如,現在做的一個發送公文並用短信通知的頁面,如果用戶重復提交,就會發送多遍公文和短信通知,產生不必要的麻煩。
如果是在添加商品之類的頁面中重復提交,就會添加上重復的產品信息。
這些情況都應該從程序的角度而非用戶的角度來避免。不能告訴用戶,你不要重復點這個按鈕,而是應該用程序實現不讓他重復點提交按鈕,或者多點了也無效。
功能很實用,代碼很簡單,如下。
<html> <head> <title>PostOnce</title> <script type="text/javascript"> function trySubmit() { if (this.submitFlag == 1) { alert('數據已經提交,請勿再次提交。'); return false; } else { this.submitFlag = 1; return true; } } </script> </head> <body> <h3>防止重復提交</h3> <form action="/Test/PostOnce2" method="post" onsubmit="return trySubmit()"> 我是程序員老孫(孫繼磊),點下面的按鈕進行提交。<br /> <input type="submit" /> </form> </body> </html>