※ajax的post方式注意點※及jsonp的封裝
GET發送的數據被解析成key和valuephp
POST發送的數據會被解析成字符串html
在發送數據以前ajax.send("user=admin"),設置請求頭信息ajax
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");json
封裝AJAX的POST請求方式app
注意發送數據參數的默認值函數
<!DOCTYPE html>jsonp
<html lang="en">ui
<head>url
<meta charset="UTF-8">code
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
</body>
<script>
document.onclick = function(){
var url = "http://127.0.0.1/1908/jsonp/data/jsonp3.php"
jsonp(url,function(res){
alert(res)
},{
pass:"root",
// 5.用來保存，後臺接收的回調函數名所在的字段名
// 爲了給本身封裝的函數傳參，放置屢次修改封裝好的函數
columnName:"cb",
// 6.根據後臺要接受的字段名,發送回調函數名,回調函數名，已經無所謂了，隨機都行
cb:"sdfsdfsdf"
})
}
function jsonp(url,success,data){
// 1.處理默認參數
data = data || {};
// 2.解析數據
var str = "";
for(var i in data){
str += `${i}=${data[i]}&`;
}
// 3.建立script標籤，設置src，準備開啓jsonp
var script = document.createElement("script");
script.src = url + "?" + str;
document.body.appendChild(script);
// 4.定義全局函數
// window.asdasdasd = function(res){
// window["asdasdasd"] = function(res){
// window[data.callback] = function(res){
// window[data["callback"]] = function(res){
window[data[data.columnName]] = function(res){
success(res);
}
}
</script>
</html>
- 1. ajax選擇post請求方式注意點
- 2. AJAX封裝+跨域（jsonp）
- 3. 封裝通用的jsonp方式
- 4. ajax及ajax的封裝
- 5. Ajax--json（Ajax調用返回json封裝代碼、格式及注意事項）
- 6. 封裝ajax支持get、post
- 7. 封裝ajax庫，post請求
- 8. 封裝ajax請求的兩種方式
- 9. jsonp的原理介紹及Promise封裝
- 10. JQuery封裝ajax的方法
- 更多相關文章...
- • XML 注意事項 - XML 教程
- • C# 封裝 - C#教程
- • 常用的分佈式事務解決方案
- • PHP Ajax 跨域問題最佳解決方案
-
每一个你不满意的现在，都有一个你没有努力的曾经。