前言
今天同事碰到一個問題，他在button上添加了點選事件，想要透過ajax請求後臺，透過成功回撥函式跳轉成功頁面。問題是後端可以收到請求，業務處理也正常，但是就是進不去成功回撥函式。可能有人已經知道為什麼了？但是並不是你想的那樣！
一、程式碼是這樣的
//ajax是這樣的。請求引數什麼的都沒有問題 $。ajax（{ type ： “post”， async ： true， data：“”，//引數沒問題， 我這裡就寫“”了 url ： “${contextPath}/cxwy/underwriting”， success ： function（data）{ var resultCode = data。resultCode； if（ resultCode == ‘success’ ）{ window。location。href=“${contextPath}/View/page/cxwy/succress。jsp？sr=”+adviceCode； layer。closeAll（）； }else if（resultCode == “fail”）{ layer。closeAll（）； var msg = data。resultMsg； layer。open（{content：msg， btn： “確定”}）； return； } } }）；二、問題分析
思路一:
根據以往的經驗，第一時間，我覺得問題出在後端返回的資料型別上。假如後端返回的不是json資料型別，前端頁面透過data。resultCode取值肯定會有問題。
我的解決是ajax新增接收的資料型別dataType ： ‘json’，後端添加註解@ResponseBody把後端返回資料型別轉為json，大功告成！前後端保持資料型別一致，並且都是json資料，心裡想著肯定沒問題了。
然後重新整理前端快取，前端打斷點，開始測試，結果還是一樣的問題，成功還是沒有進來，並且當前頁面地址後面還新增上了引數。有點神奇哈。
思路二:
“事出反常必有妖”，透過查詢資料發現，onclick事件執行完畢以後，會執行瀏覽器的預設事件，button按鈕的預設型別是type=“submit” ，也就是會說，ajax執行的時候，還有一個form表單提交事件。
由於form表單的action屬性為空，那麼這個請求將由當前頁面的路徑來處理。而form表單預設是get請求，所有就出現上圖中的地址。
找到原因了，解決方法就非常多了~
方法一:
onclick事件中新增return false，取消瀏覽器預設事件。
方法二:
給button 新增type=“button”，這樣就不會有表單提交事件了。
方法三:
不用button標籤了， 換用span、div等。但是會影響到頁面的樣式，還需要再修改頁面的樣式，不推薦這種！！！
方法非常多，不一一列舉了，比如就用不用form標籤了。。。。。
喜歡的話，可以關注公眾號“莫非技術棧”，免費領取學習資源~
