前端的坑-提交表單頁面自動重新整理
阿新 • • 發佈:2019-01-08
遇到的問題
最近一段時間需要用到jsp加上ajax區域性的重新整理頁面,本來並不是一個比較複雜的功能,但是卻遇到了比較大的問題,問題的具體情況是每當區域性重新整理之後頁面就會自動重新整理,然後就又回到了沒有重新整理前的狀態,這讓人感覺很坑爹啊!
排查問題
有問題了,當然是要首先排查程式碼了,看了無數次的程式碼,都沒發現會導致頁面自動重新整理的情況,讓人十分苦惱。
然後的話,就想著難道是jquery的html()方法重新整理頁面,後來查了很久,也沒有能夠找出來。
無奈之下,回去看頁面,發現了一個細節,原來這個地方的搜尋按鈕在一個表單之中,偶,萬事大吉,終於找到了。原來是所使用的bootstrap的導航欄使用了表單。
<script language="javascript" type="text/javascript">
$("#search").click(function() {
$.ajax({
type : "POST",
url : "/ajaxsearch/零食",
async : false,
data : {},
dataType : "html",
timeout : 1000,
success : function (dates) {
$("#mainContent").html(dates);
window.event.returnValue = false;
},
error : function() {
console.log("請求失敗,請重試!");
}
});
});
</script>
收穫
這次的收穫就是當你所做的東西依賴第三方的時候,一定要小心一些小的細節,小心被坑到,有時候被坑到還渾然不自知,真的是相當的傷心啊!
然後,還有就是當表單提交的時候會重新整理當前的頁面,那麼,如何阻止?只需要加上window.event.returnValue = false;