有关AJAX

最新推荐文章于 2024-10-04 20:50:40 发布

weixin_38606268

最新推荐文章于 2024-10-04 20:50:40 发布

阅读量361

点赞数

文章标签： ajax

本文链接：https://blog.csdn.net/weixin_38606268/article/details/121422467

版权

简介

AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术，AJAX 使用 JavaScript 在 web 浏览器与 web 服务器之间来发送和接收数据。AJAX 通过在后台与服务器进行少量数据交换，使网页实现异步更新。这意味着可以在不重载整个页面的情况下，对网页的某些部分进行更新

AJAX 基于因特网标准，并使用以下技术组合：

· XMLHttpRequest 对象（与服务器异步交互数据）

· JavaScript/DOM（显示/取回信息）

· CSS（设置数据的样式）

· XML（常用作数据传输的格式）

AJAX 应用程序与浏览器和平台无关的！

XMLHttpRequest 对象是 AJAX 的关键

Ajax与PHP、MySQL

要注意Ajax与PHP异步处理以及回调的真实使用流程

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Title</title>

 <script>
 function showUser(str)
 {
 if (str=="")
 {
 document.getElementById("txtHint").innerHTML="";
 return;
 }
 if (window.XMLHttpRequest)
 {
 // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
 xmlhttp=new XMLHttpRequest();
 }
 else
 {
 // IE6, IE5 浏览器执行代码
 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
 xmlhttp.onreadystatechange=function()
 {
 if (xmlhttp.readyState==4 && xmlhttp.status==200)
 {
 document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
 }
 }
 xmlhttp.open("GET","getuser.php?q="+str,true);
 xmlhttp.send();
 }
 </script>
</head>
<body>
<form>
 <select name="users" onchange="showUser(this.value)">
 <option value="">Select a person:</option>
 <option value="1">John Doe</option>
 <option value="2">tom Mary</option>
 <option value="3">lijing liuqi</option>
 <option value="4">liu li</option>
 </select>
</form>
<br>
<div id="txtHint"><b>数据库信息展示在这</b></div>

</body>
</html>

<?php
 $q=$_GET["q"];
 
 $con = mysqli_connect('localhost','root','root','test');
 if (!$con)
 {
     die('Could not connect: ' . mysqli_error($con));
 }
 
 //mysqli_select_db($con,"ajax_demo");
 $sql="SELECT * FROM Myguests WHERE id = ".$q;
 
 $result = mysqli_query($con,$sql);
 
 echo "<table border='1'>
 <tr>
 <th>firstname</th>
 <th>lastname</th>
 <th>email</th>
 <th>Age</th>
 
 </tr>";
 
 while($row = mysqli_fetch_array($result))
 {
     echo "<tr>";
     echo "<td>" . $row['firstname'] . "</td>";
     echo "<td>" . $row['lastname'] . "</td>";
     echo "<td>" . $row['email'] . "</td>";
     echo "<td>" . $row['Age'] . "</td>";
    ;
     echo "</tr>";
 }
 echo "</table>";
 
 mysqli_close($con);
 ?>

最终可以在当前页面上显示数据库选取的数据