                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /Ajax全接触

为什么这里传给后台的data不用json格式，如果用json格式，该怎么写

document.getElementById("save").onclick = function() { 
	var request = new XMLHttpRequest();
	request.open("POST", "server.php");
	var data = "name=" + document.getElementById("staffName").value
	                  + "&number=" + document.getElementById("staffNumber").value 
	                  + "&sex=" + document.getElementById("staffSex").value 
	                  + "&job=" + document.getElementById("staffJob").value;
	request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
							
	request.send(data);							
	request.onreadystatechange = function() {
		if (request.readyState===4) {
			if (request.status===200) { 
				document.getElementById("createResult").innerHTML = request.responseText;
			} else {
				alert("发生错误：" + request.status);
			}
		} 
	}
}

newsudhc3634140

2016-08-01

源自：Ajax全接触 4-2

关注问题我要回答

1376

操作

收起

2 回答

慕粉3473542 回答被采纳 +3 积分
2016-08-01

以下是W3Cschool上对send 方法的解释：

当send方法被用作post 请求时，需要接收string类型的参数。这就是为什么代码中要拼出一个很长的字符串用作参数。如果想写成JSON格式比如

var data={
    "name": document.getElementById("staffName").value
    ...
    }

那么data还是不能被用作send的参数，因为JS中变量的类型是它所指向的目标的类型，所以以上代码中data的类型是 Object，并不为send方法所接受。

3 回复有任何疑惑可以回复我~

收起回答

慕粉3473542
2016-08-02

我觉得一般不需要用ajax从服务器获取图片。用<img>标签，浏览器解析到这个标签就会自动下载图片并进行渲染。

至于上传图片，我所知道的是出于安全考虑，JS是不能直接操作本地的文件。其他的不是很清楚，所以我去查了一些资料：

https://developer.mozilla.org/en-US/docs/Web/API/FormData/Using_FormData_Objects

总结一下：

可以用FormData 对象用Ajax实现文件上传。

FormData support starts from following desktop browsers versions. IE 10+, Firefox 4.0+, Chrome 7+, Safari 5+, Opera 12+

限制是这是XHR2 标准，只有部分浏览器支持.实现代码：

var formData = new FormData();
formData.append("username", "Groucho");
formData.append("accountnum", 123456);
formData.append("userfile", fileInputElement.files[0]);
var request = new XMLHttpRequest();
request.open("POST", "submitform.php);
request.send(formData)

还有一种实现不用formData对象，而是用绝大部分浏览器都支持的<form> 标签和<iframe>来实现类似Ajax的效果，即上传文件而不刷新页面。我个人觉得和ajax没有很大关系可作为参考

http://www.ajaxf1.com/tutorial/ajax-file-upload-tutorial.html#