如何使用AJAX将变量从JavaScript发送到PHP脚本
对于我的项目,我需要执行以下操作:如何使用AJAX将变量从JavaScript发送到PHP脚本,javascript,php,ajax,Javascript,Php,Ajax,对于我的项目,我需要执行以下操作: 用户在画布上按下鼠标(html页面) JavaScript函数保存已按下点的坐标 将此信息发送到PHP脚本 PHP脚本将此数据添加到MySQL数据库 其他坐标被放入JSON并发送回客户机,并显示在同一画布上 现在,我已经研究了步骤3的问题(我不知道如何做)。有不同的方式,我选择了以下两种: 在我的情况下,哪种方式是最好的选择?还有更好的/正确的方法吗?我不认为一定有“正确”的方法,但是你可以遵循一些好的想法。其中一个想法是:使用POST进行“创建”操作,使
在我的情况下,哪种方式是最好的选择?还有更好的/正确的方法吗?我不认为一定有“正确”的方法,但是你可以遵循一些好的想法。其中一个想法是:使用
POST
进行“创建”操作,使用GET
进行“读取”操作。因此,您应该向服务器发出AJAXPOST
请求,并通过POST
参数传递坐标
// will use this to turn an object into a url encoded string
var serializeObject = function(obj) {
var output = '';
for(var attr in obj) {
if(obj.hasOwnProperty(attr)) {
output += attr + '=' + obj + '&';
}
}
return output.slice(0, -1);
};
var url = 'http://www.example.com/save.php';
// you need to serialize your data into key value pairs like the following
var exampleCoords = {
x: 10,
y: 20,
z: 30
};
// postData will be x=10&y=20&z=30
var postData = serializeObject(exampleCoords);
var request = new XMLHttpRequest();
request.open('POST', url, true);
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
request.setRequestHeader("Content-length", postData.length);
request.setRequestHeader("Connection", "close");
// this function gets called when the request changes
request.onreadystatechange = function() {
// request was successful
if(request.readyState == 4 && request.status == 200) {
alert(request.responseText);
}
}
request.send(postData);
使用jQuery,您可以大大简化代码(尽管它在幕后也做了同样的事情):
您可以使用$\u POST['x']
在PHP中访问这些变量,确保在MySQL中使用这些数据之前对其进行清理
记录在案,AJAX和
XMLHttpRequest
是同一事物的不同名称,AJAX只是指异步Javascript和XML(如XMLHttpRequest
),XMLHttpRequest
是用于执行AJAX请求的内置对象您知道AJAX是XMLHttpRequest吗?这就像说“使用福特F150”或“使用卡车”。它们是一样的。jQuery是允许的,我对它不是很精通,但我会研究它。它能满足我的需要吗?马克,不,我没有意识到,我以为那是两种不同的发送信息的方式。可能我误解了第二个链接(第三篇文章),因为作者说这些方法是不同的。
var url = 'http://example.com/save.php';
var coords = {
x: 10,
y: 20,
z: 30
};
$.post(url, coords).then(function(response) {
console.log(response);
});