在jsp中提交請求而不重新整理頁面的方法
今天要實現一個倒數計時的功能,比如你忘記密碼了,然後你需要先獲取一個驗證碼,然後頁面倒數計時60秒之內你如果填進去且驗證通過的話那麼你就可以修改密碼了,這是當下許多網站的基本方式。所以首先你提交一個form,網站會給你一個含有驗證碼的郵件,但是這個倒數計時使用js寫的,所以你提交form表單之後是不能夠重新整理頁面的,否則倒數計時功能便失去了。
在網上看了看說現在如果要想實現不重新整理而提交請求,只有兩種方式,一種是iframe方式,另一種是ajax方式。我用iframe實現了。
其實就是
<iframe src="about:blank" name="blankFrame" id="blankFrame" style="display: none;"></iframe>
<form method="post" action="/TaoWei/UserForgetPass" target="blankFrame" id="form11">
我把response返回在一個不顯示的iframe裡面,這樣便不重新整理了。
再看看我的倒數計時功能吧:
<script type="text/javascript">
var wait=60;
function time(o) {
if (wait == 0) {
document.getElementById("validateDiv").style.display="none";
o.removeAttribute("disabled");
o.value="獲取驗證碼";
wait = 60;
} else {
o.setAttribute("disabled", true);
o.value="重新傳送(" + wait + ")";
wait--;
setTimeout(function() {
time(o)
},
1000)
}
}
document.getElementById("btn").onclick=function(){time(this);document.getElementById("validateDiv").style.display="";
document.forms[0].submit();
}
</script>
小心最後一條語句。如果改成onsubmit則不行,我估計是阻塞了。
相關文章
- JS指令碼中重新整理當前頁面的方法JS指令碼
- plsql提交請求SQL
- 在MyEclipse中修改jsp頁面的預設開啟方式EclipseJS
- react中請求介面的封裝React封裝
- 程式中載入layout以及提交請求
- ASP.NET重新整理頁面的六種方法ASP.NET
- 關於Jdon請求彈出新頁面的問題!!!
- 請教高手servlet與JSP頁面的通訊問題?ServletJS
- Oracle EBS提交過多請求批量取消的方法Oracle
- ASP.NET頁面重新整理:自動重新整理頁面的實現方法總結ASP.NET
- WebForm 頁面ajax 請求後臺頁面 方法WebORM
- vue專案重新整理當前頁面的三種方法Vue
- ASP.NET重新整理頁面的六種方法總結ASP.NET
- sendBeacon 重新整理/關閉頁面之前傳送請求
- 在 Laravel 中處理請求驗證的智慧方法Laravel
- Web Beacon 重新整理/關閉頁面之前傳送請求Web
- 可以重新整理頁面的javascript程式碼JavaScript
- springboot打jar包請求jsp請求不到問題Spring BootJARJS
- 在Node.js中發起HTTP請求的5種方法Node.jsHTTP
- 網頁請求(Ajax)網頁
- html頁面中如何傳送ajax請求HTML
- [JS] IE下ajax請求不生效或者請求結果不更新JS
- JSP生成靜態HTML頁面的實踐方法和設計思路薦JSHTML
- 在 DotNetty 中實現同步請求Netty
- 在 React Hooks 中如何請求資料?ReactHook
- HTTP請求方法HTTP
- JSP頁面中嵌入UEditor編輯器方法JS
- 在不重新整理頁面的情況下呼叫遠端asp指令碼 (轉)指令碼
- SpringMVC中如何傳送GET請求、POST請求、PUT請求、DELETE請求。SpringMVCdelete
- button按鈕重新整理頁面的幾種方式
- struts 中如何將jsp頁面中的一個物件傳到提交的action裡JS物件
- EBS R12.1中如何提交一個請求(Concurrent Request)
- iframe下重新整理頁面無法重新整理當前頁面的解決辦法
- 提交一個併發請求(Concurrent Program)
- iOS 使用form表單形式提交post請求iOSORM
- 深入理解OkHttp原始碼(一)——提交請求HTTP原始碼
- EBS提交併發請求的簡單例子單例
- EBS 取消“是否提交另一項請求”提示