在customer.php的文件中，代码如下：

<html>

<head>

<script type="text/javascript">

function showCustomer(str)

{

 var xmlhttp;  

if (str=="")

  {

  document.getElementById("txtHint").innerHTML="";

  return;

  }

if (window.XMLHttpRequest)

  {// code for IE7+, Firefox, Chrome, Opera, Safari

    xmlhttp=new XMLHttpRequest();

  }

else

  {// code for 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","/test/getcustomer.php?q="+str,true);//这里的url是指你的文件路径，例如，我的customer.php和getcustomer.php都在www下的test文件                                                                                                          目录下，所以就写成了此种形式

   xmlhttp.send();

}

</script>

</head>

<body>

<form action="" style="margin-top:15px;"> 

<label>请选择一位客户：

<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>

</label>

</form>

<br />

<div>客户信息将在此处列出 ...</div>

<div id="txtHint"></div>

</body>

</html>

在getcustomer.php的文件中，代码如下：

<?php

$q=$_GET["q"];

$con = mysql_connect('localhost', 'root', 'root');

if (!$con)

 {

 die('Could not connect: ' . mysql_error());

 }

mysql_select_db("test", $con);

$sql="SELECT * FROM user1 WHERE  firstname= '".$q."'";

//var_dump($sql);

$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);

?>

//数据库是test， 表是user1，一共有五个字段，分别是firstname，lastname，age，hometown和Job

最后能实现页面无刷新字段的变化的效果！刚学Ajax，感觉很不错！

Ajax入门例子的更多相关文章

  1. 掌握 Ajax，第 1 部分: Ajax 入门简介

    转:http://www.ibm.com/developerworks/cn/xml/wa-ajaxintro1.html 掌握 Ajax,第 1 部分: Ajax 入门简介 理解 Ajax 及其工作 ...

  2. ASP.NET AJAX入门系列（4）：使用UpdatePanel控件（一）

    UpdatePanel可以用来创建丰富的局部更新Web应用程序,它是ASP.NET 2.0 AJAX Extensions中很重要的一个控件,其强大之处在于不用编写任何客户端脚本,只要在一个页面上添加 ...

  3. 【Bootstrap Demo】入门例子创建

    本文简单介绍下如何来使用 Bootstrap,通过引入 Bootstrap,来实现一个最基本的入门例子. 在前一篇博文[Bootstrap]1.初识Bootstrap 基础之上,我们完全可以更加方便快 ...

  4. 【Bootstrap】入门例子创建

    本文简单介绍下如何来使用 Bootstrap,通过引入 Bootstrap,来实现一个最基本的入门例子. 在前一篇博文[Bootstrap]1.初识Bootstrap 基础之上,我们完全可以更加方便快 ...

  5. spring boot入门例子

    最近学习spring boot,总结一下入门的的基础知识 1新建maven项目,修改pom.xml <project xmlns="http://maven.apache.org/PO ...

  6. MINA经典入门例子----Time Server

    原文地址 http://blog.sina.com.cn/s/blog_720bdf0501010b8r.html 貌似java的IO.NIO的入门例子都有相关的Time Server Demo.本例 ...

  7. 一个简单的iBatis入门例子

    一个简单的iBatis入门例子,用ORACLE和Java测试 目录结构: 1.导入iBatis和oracle驱动. 2.创建类Person.java package com.ibeats;import ...

  8. JPA入门例子(采用JPA的hibernate实现版本) 转

    JPA入门例子(采用JPA的hibernate实现版本) jpahibernate数据库jdbcjava框架(1).JPA介绍: JPA全称为Java Persistence API ,Java持久化 ...

  9. AJAX入门---DOM操作HTML

    AJAX入门---DOM操作HTML 一边学习AJAX一边坐着总结加深印象.上次写的是怎样简单的使用XMLHttpRequest对象.今天写的是DOM(文档对象模型(Document Object M ...

随机推荐

  1. #21 Python异常

    前言 运行程序时经常遇到各种错误,例如:ImportError(导入模块错误).IndexError(索引错误).NameError(变量错误).SyntaxError(语法错误).Indentati ...

  2. spark集群的简单测试和基础命令的使用

    写此篇文章之前,已经搭建好spark集群并测试成功: spark集群搭建文章链接:http://www.cnblogs.com/mmzs/p/8193707.html 一.启动环境 由于每次都要启动, ...

  3. 第一册：lesson fifty nine。

    原文: Is that all? A:I want some envelopes ,please? B:Do you want the large size or small size? A:The ...

  4. 使用PoolingHttpClientConnectionManager解决友盟(umeng)推送在多线程环境推送失败的问题

    在友盟(umeng)提供的服务端推送的sdk中,使用的是apache提供的httpclient.在单线程化境下,httpclient工作没有问题.但是由于umeng的sdk中并未考虑并发的情况,因此很 ...

  5. SQL--server事物

    事物 特点: 1.原子性:事物必须是一个自动工作的单元, 2.一致性:事物结束的时候,所有内部数据都是正确的 3.隔离性:并发多个事物时,各个事物不干涉内部数据,处理的都是另外一个事物处理之前或之后的 ...

  6. .Net Core 使用 System.Drawing.Common 部署到CentOS上遇到的问题

    一开始报这个错误:Unable to load shared library 'libdl' 找到libdl安装位置是/usr/lib64: #locate libdl /usr/lib64/libd ...

  7. [PHP] 算法-字符串的全排列的PHP实现

    输入一个字符串,按字典序打印出该字符串中字符的所有排列.例如输入字符串abc,则打印出由字符a,b,c所能排列出来的所有字符串abc,acb,bac,bca,cab和cba. 思路: 1.利用递归形成 ...

  8. [android] activity横竖屏切换的生命周期

    模拟器横竖屏切换,ctrl+f11 界面activity会销毁,重新打开创建 第一种做法: 定死就是横屏 在清单文件,<activity/>节点部分,添加属性,设置屏幕朝向 android ...

  9. HTML标签笔记

    换行符:<br/> 首部: <!DOCTYPE>: 说明html文档使用的标准, 在HTML5中仅为 <!DOCTYPE html>1.头标签 <head&g ...

  10. 7.通用程序设计_EJ

    第45条: 将局部变量的作用域最小化 该条目与第13条(使类和成员的可访问性最小)本质上是类似的.要使局部变量的作用域最小化,最有利的方法就是在第一次使用它的地方声明.在每个局部变量的声明处都应该包含 ...