一、传统Web应用 (文件命名为SY10_1_submit.php) --重新加载整个页面 - 不友好
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>AJAX Example</title>
</head>
<body>
<form action="">
学号:<input type="text" name="XH" size="12">
课程名:<input type="text" name="KCM" size="12">
<input type="submit" value="查询" name="bt1"><br>
成绩:<input type="text" name="CJ" size="12" id="CJ">
</form>
<?php
if(isset($_GET['bt1'])){
$XH=$_GET['XH']; //取得XH的值
$KCM=$_GET['KCM']; //取得KCM的值
$conn=mysqli_connect("localhost","root",""); //连接MySQL服务器
mysqli_select_db($conn, "PXSCJ"); //选择PXSCJ数据库
mysqli_query($conn, "SET NAMES utf8mb4"); //将MySQL字符集设为gb2312
$sql="select 成绩 from CJB where 学号='$XH' and 课程号=(select 课程号 from KCB where 课程名='$KCM')";
$result=mysqli_query($conn, $sql); //执行SQL语句$sql
$row=mysqli_fetch_array($result);
if($row)
echo "<script> document.getElementById('CJ').value = $row[0]; </script>" ; //嵌入JS在'CJ'输出成绩
else
echo "<script> document.getElementById('CJ').value= '".'无此成绩'."' ; </script>" ;
}
?>
</body>
</html>
二、使用GET方式实现一个简单的服务器请求,通过输入学生学号和课程名,查看学生的成绩(文件命名为SY10_2_main.php、SY10_2_process.php) – GET方式的PHP与AJAX交互 P297
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>AJAX Example</title>
<script>
function GetXmlHttpObject(){
//不同的浏览器使用不同的方法
var XMLHttp=null; //来创建XMLHttpRequest对象
try {
XMLHttp=new XMLHttpRequest();
} //NetScape等浏览器
catch(e){
try {
XMLHttp=new ActiveXObject("Msxml2.XMLHTTP");
} //IE6以上版本浏览器
catch(e){
XMLHttp=new ActiveXObject("Microsoft.XMLHTTP");}
}
return XMLHttp;
}
function cj_query(){
XMLHttp=GetXmlHttpObject();
//调用函数GetXmlHttpObject()初始化XMLHttpRequest
var XH=document.getElementById("XH").value;