前後端進行互動的方式
阿新 • • 發佈：2022-12-09
1、在前端頁面中編寫傳送請求的方法，點選事件來完成。選中對應的按鈕（$（“選擇器”）），再去新增點選的事件，$.ajax()函式傳送非同步請求。
2、JQUery封裝了一個函式，稱之為$.ajax()函式，意即通過物件呼叫ajax()函式，可以非同步載入相關的請求。依靠的是JavaScript提供的一個物件XHR（XmlHttpResponse），封裝了這個物件。
3、ajax（）使用方式。需要傳遞一個方法體作為方法的引數來使用，一對大括號稱之為方法體。ajax接收多個引數，引數之間使用“，”進行分隔，每一組引數之間使用“：”進行分隔，引數的組成部分一個是引數的名稱（不能隨意定義，只能使用ajax封裝好的引數），，另一個是引數的值，引數的值要求是用字串來表示。語法結構如下：
$.ajax({
url:"",
type:"",
data:"",
dataType:"",
success:function(){
},
error:function(){
},
});
4、ajax()函式引數的含義：
| 引數 | 功能描述 |
| url | 標識請求的地址（url地址）,不能包含引數列表部分的內容。例如：url：“localhost:8080/users/reg” |
| type | 請求型別（GET和POST請求的型別）。例如：type:"POST" |
| data | 向指定的請求url地址提交的資料。例如：data:"username=tom&pwd=123" |
| dataType | 提交的資料的型別。資料的型別一般指定為json型別。dataType:"json" |
| success | 當伺服器正常響應客戶端時，會自動呼叫success引數的方法，並且將伺服器返回的資料以引數的形式傳遞給這個方法的引數上。 |
| error | 當伺服器未正常響應客戶端時，會自動呼叫error引數的方法，並且將伺服器返回的資料以引數的形式傳遞給這個方法的引數上。 |
5、js程式碼可以獨立宣告在一個js的檔案中或宣告在一個script標籤中。
6、js程式碼無法正常被伺服器解析執行，體現在點選頁面中的按鈕沒有任何響應。解決方案：
（1）在專案的maven下clear清理專案，然後再install重新部署；
（2）在專案的file選項下-cash清理快取；
（3）重新構建專案：build選項下-rebuild選項；
（4）重啟idea；
（5）重啟電腦。