AJAX Database 实例

最新推荐文章于 2021-08-06 00:43:52 发布

Janson666

最新推荐文章于 2021-08-06 00:43:52 发布

阅读量206

点赞数

分类专栏： AJAX HTTP MySql

本文链接：https://blog.csdn.net/qq_42102911/article/details/103055655

版权

MySql 同时被 3 个专栏收录

11 篇文章 0 订阅

订阅专栏

AJAX

5 篇文章 0 订阅

订阅专栏

HTTP

4 篇文章 0 订阅

订阅专栏

1. 引言：

在1 学习了AJAX 的基础知识后，我们知道AJAX 可以实现在不更新整个网页的情况下，动态的更新某一部分的网页内容，但是 AJAX 到底是如何跟数据库（Database）进行交互的了？他跟直接用Java或者其他语言连接数据库有什么不同？大家有没有好奇了，下边我们就看看 AJAX 是如何实现和数据库进行动态的通信。

1.2 实例：

下边的例子将演示网页如何通过 AJAX 从数据库读取信息：

1.2.1 源代码（AJAX 浏览器页面）

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
function showCustomer(str)
{
  var xmlhttp;    
  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","/try/ajax/getcustomer.php?q="+str,true);
  xmlhttp.send();
}
</script>
</head>
<body>

<form action=""> 
<select name="customers" onchange="showCustomer(this.value)" style="font-family:Verdana, Arial, Helvetica, sans-serif;">
<option value="APPLE">Apple Computer, Inc.</option>
<option value="BAIDU ">BAIDU, Inc</option>
<option value="Canon">Canon USA, Inc.</option>
<option value="Google">Google, Inc.</option>
<option value="Nokia">Nokia Corporation</option>
<option value="SONY">Sony Corporation of America</option>
</select>
</form>
<br>
<div id="txtHint">客户信息将显示在这...</div>

</body>
</html>

分析：代码中设置了一个复选框，当选择某个选项时，会执行showCustomer() 函数，该函数由 " onchange " 事件触发

showCustmer() 函数执行以下任务：

检查是否已选择某个客户

创建XMLHttpRequest 对象

当服务器响应就绪时，执行所创建的函数
把请求发送到服务器上的文件
请注意，我们向URL中添加了一个参数 q (带有输入域中的内容)

1.2.2 AJAX 服务器页面

用 PHP 编写的服务器页面“getcustomer.php” 中的源代码负责对数据库进行查询，然后用HTML表格返回查询结果：

<%
response.expires=-1
//定义数据库查询语句
sql="SELECT * FROM CUSTOMERS WHERE CUSTOMERID="

//执行数据库查询指令
sql=sql & "'" & request.querystring("q") & "'"

//连接数据库
set conn=Server.CreateObject("ADODB.Connection")
conn.Provider="Microsoft.Jet.OLEDB.4.0"
conn.Open(Server.Mappath("/db/northwind.mdb"))
set rs=Server.CreateObject("ADODB.recordset")
rs.Open sql,conn

//定义以html 输出页面
response.write("<table>")
do until rs.EOF
  for each x in rs.Fields
    response.write("<tr><td><b>" & x.name & "</b></td>")
    response.write("<td>" & x.value & "</td></tr>")
  next
  rs.MoveNext
loop
response.write("</table>")
%>

Janson666

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
AJAX Database 实例

1. 引言：在1 学习了AJAX 的基础知识后，我们知道AJAX 可以实现在不更新整个网页的情况下，动态的更新某一部分的网页内容，但是 AJAX 到底是如何跟数据库（Database）进行交互的了？他跟直接用Java或者其他语言连接数据库有什么不同？大家有没有好奇了，下边我们就看看 AJAX 是如何实现和数据库进行动态的通信。1.2实例：下边的例子将演示网页如何通...
复制链接

扫一扫