ajax 可用来与数据库进行动态地通信。
在下面的 ajax 例子中，我们将演示如何使用 ajax 技术令网页从数据库读取信息。
上面的实例包含了一个简单的 html 表单以及执行 javascript 的链接：
<html><head><script src="selectcustomer.js"></script></head><body><form>请选择一位客户：<selectname="customers" onchange="showcustomer(this.value)"><option value="alfki">alfreds futterkiste<option value="norts ">north/south<option value="wolza">wolski zajazd </select></form><p><divid="txthint"><b>客户信息将在此处列出。</b></div></p></body></html>
正如您看到的，这是一个简单的带有一个名为 "customers" 下拉列表的 html 表单。
表单以下的段落包含了一个名为 "txthint" 的 div，这个 div 充当了由 web 服务器所取回的信息的位置占位符。
当用户选择数据时，名为 "showcustomer()" 的函数会被执行。函数的执行会被 "onchange" 事件触发。另外需要说明的是：每当用户改变下拉列表中的值，函数 showcustomer 就会被调用。
下面列出了 javascript 代码。
这是存储在文件 "selectcustomer.js" 中的 javascript 代码：
var xmlhttpfunction showcustomer(str){ xmlhttp=getxmlhttpobject();if (xmlhttp==null) { alert ("您的浏览器不支持ajax！"); return; } var url="getcustomer.asp";url=url+"?q="+str;url=url+"&sid="+math.random();xmlhttp.onreadystatechange=statechanged;xmlhttp.open("get",url,true);xmlhttp.send(null);}function statechanged(){ if (xmlhttp.readystate==4){ document.getelementbyid("txthint").innerhtml=xmlhttp.responsetext;}}function getxmlhttpobject(){var xmlhttp=null;try { // firefox, opera 8.0+, safari xmlhttp=new xmlhttprequest(); }catch (e) { // internet explorer try { xmlhttp=new activexobject("msxml2.xmlhttp"); } catch (e) { xmlhttp=new activexobject("microsoft.xmlhttp"); } }return xmlhttp;}
这个被 javascript 调用的服务器页面，是一个名为 "getcustomer.asp" 的简单的 asp 文件。
此页面使用 vbscript 针对 iis 编写。可以使用 php 或其他服务器语言对它进行改写。
此代码可运行针对某个数据库的 sql，并以 html 表格返回结果：
<%response.expires=-1sql="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, connresponse.write("<table>")do until rs.eof for each x in rs.fields response.write("<tr><td><em>" & x.name & "</em></td>") response.write("<td>" & x.value & "</td></tr>") next rs.movenextloopresponse.write("</table>")%>新闻热点
疑难解答
图片精选
