‘壹’ 如何在同一个php页面,通过ajax把值传给PHP变量
举个例子:你想在用户点击时,把 apple 这个字符串,通过前端传给后端。
前端,用 jQuery 举例:
$('button').click(function () {
$.ajax({
url: '/xxx',
method: 'post',
dataType: 'json',
data: {fruit: 'apple'}
}).done(function (res) {
// 成功后的回调
}).fail(function (err) {
// 失败后的回调
});
});
后端 PHP 处理:
$fruit = $_POST['fruit']; // 获取从 ajax 传过来的 fruit 的值,这里是 apple。
如果你想在前端重新显示这个字符串 apple,那么你要用 PHP 把数据返回给页面,然后在上面 “// 成功后的回调” 里面,补充逻辑代码。
例如 PHP 把 apple 返回给前端:
return json_encode(array('fruit' => 'apple'));
前端回调处理:
// 成功后的回调
alert(res.fruit); // 弹框显示 “apple”
实际上,$_POST 能够获取所有从前端用 post 方式提交过来的数据,不管你是页面刷新方式,还是 ajax(jQuery 才叫 ajax,实际上它是 XMLHttpRequest,异步非阻塞的请求方式)
‘贰’ Ajax怎么调用后台php代码访问数据库并显示
由 JavaScript 调用的服务器页面,是名为 "getuser.php" 的简单 PHP 文件。
该页面用 PHP 编写,并使用 MySQL 数据库。
其中的代码执行针对数据库的 SQL 查询,并以 HTML 表格返回结果:
<?php
$q=$_GET["q"];
$con = mysql_connect('localhost', 'peter', 'abc123');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("ajax_demo", $con);
$sql="SELECT * FROM user WHERE id = '".$q."'";
$result = mysql_query($sql);
echo "<table border='1'>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
<th>Hometown</th>
<th>Job</th>
</tr>";
while($row = mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['FirstName'] . "</td>";
echo "<td>" . $row['LastName'] . "</td>";
echo "<td>" . $row['Age'] . "</td>";
echo "<td>" . $row['Hometown'] . "</td>";
echo "<td>" . $row['Job'] . "</td>";
echo "</tr>";
}
echo "</table>";
mysql_close($con);
?>
例子解释:
当查询从 JavaScript 被发送到这个 PHP 页面,会发生:
PHP 打开到达 MySQL 服务器的连接
找到拥有指定姓名的 "user"
创建表格,插入数据,然后将其发送到 "txtHint" 占位符
‘叁’ php如何获取jquery ajax传递过来的值
方法和详细的操作步骤如下:
1、第一步,安装并配置PHP集成环境,以phpstudy为例,见下图,转到下面的步骤。
‘肆’ Ajax向服务器发送请求和接收返回的信息
Ajax向服务器发送请求
Ajax对象创建完成后,下面就要讲解一下Ajax如何使用。首先详细讲解一下Ajax向服务器发送请求所需的两个方法,具体如下:
(1)open()方法
open()方法用于创建一个新的HTTP请求,并指定此请求的类型(如GET、POST等)、URL以及验证信息,其声明方式如下所示:
在上述声明中,method用于指定请求的类型,其值可为POST、GET、PUT及PROPFIND,大小写不敏感;URL表示请求的地址,可以为绝对地址也可以为相对地址,并且可以传递查询字符串。其余参数为可选参数,其中,asyncFlagy用于指定请求方式,同步请求为false,默认为异步请求true;userName用于指定用户名,password用于指定密码。
(2)send()方法
send()方法用于发送请求到HTTP服务器并接收回应。其声明方式如下所示:
在上述声明中,content用于指定要发送的数据,其值可为DOM对象的实例、输入流或字符串,一般与POST请求类型配合使用,需要注意的是,如果请求声明为同步,该方法将会等待请求完成或者超时才会返回,否则此方法将立即返回。
需要注意的是,在使用GET方式传递特殊字符或中文参数时,要使用JavaScript中的encodeURIComponent()函数将其转换成“%十六进制数”的形式,防止在某些浏览器(如IE浏览器)中中文乱码的问题。
Ajax接收服务器返回的信息
了解Ajax向服务器发送请求后,下面将对Ajax如何接收服务器返回的信息(例如,HTML标签、CSS样式、字符串、XML、JSON等),进行详细讲解。具体如下:
(1)readyState属性
readyState属性用于返回Ajax的当前状态,状态值有5种形式,具体如表所示。
(2)onreadystatechange属性
onreadystatechange事件属性用于感知readyState属性状态的改变。为了大家更好的理解这两个属性的使用,下面创建一个服务器端的文件index.php,用于输出字符串,然后在浏览器端index.html中向服务器端发送请求,并在控制台输出状态值。具体示例如下所示:
创建服务器端文件:index.php
创建浏览器端文件:index.html
在浏览器中访问客户端文件,按“F12”键,切换到控制台,查看输出结果,具体如下图所示。
从图中可以看出,通过onreadystatechange事件属性可以清晰的感知Ajax状态的改变,同时使用readyState获取转变后的状态值。例如Ajax从0(未初始化)状态变成1(初始化)状态值时,Ajax此时的状态值为1。
(3)status属性
status属性用于返回当前请求的HTTP状态码,常见的状态码如表所示。
值得一提的是,在感知当前Ajax对象状态时,为了追求程序的严谨性,需要同时判断当前HTTP状态status是否等于200(请求成功)。
需要注意的是,Ajax中的statusText属性,仅当数据发送并接收完毕后,才可以获取当前请求的响应状态。
(4)获取响应信息的相关属性
当数据接收完毕且请求服务器的请求成功时,即可以使用Ajax中提供的相关属性获取服务器的响应信息。具体的属性及相关说明如下表所示。
在上表中,responseText属性用于返回文本格式的响应数据;属性responseBody表示直接从服务器返回并未经解码的二进制数据;responseXML属性用于接收XML数据格式的响应数据。