图书馆占座系统（三）

第一次更新（2018.8.3 23：27）

用ajax进行前端和后端php代码的数据交换；
首先用ajax进行前端和后端的数据交换时，要用到jQuery库，链接上jQuery库，代码如下

<script src="jquery-3.3.1.JS"></script>

要注意，如果还要再写js脚本，则必须在下面再写上<script> </script>

然后就要写函数了
首先判断浏览器并根据不同的浏览器来取用不同的方法
代码如下：

if (window.XMLHttpRequest){
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
        xmlhttp=new XMLHttpRequest();
      } 
else {
// IE6, IE5 浏览器执行代码
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
     }

然后就需要根据html里面的内容进行调用函数
在所调用的函数里，必须先判断先判断服务器是否准备好接受数据
代码如下：

xmlhttp.onreadystatechange=function()
/*onreadystatechange的函数意思为当服务器响应已经做好被处理的准备是做出的响应*/
{
    if (xmlhttp.readyState==4 && xmlhttp.status==200)/*readystate的值为4或status为200
    时代表服务器可以与之通信*/
            {
//这里写自己所需要的代码
            }

在自己的函数调用结束后，且在</script>标签前面，要使用ajax语句来进行与php脚本的通信
代码如下：

xmlhttp.open("GET","登录1.php?q="+str,true);//第一个参数为请求方式
//第二个参数为所传参数php的路径，第三个参数为是否进行异步传输
xmlhttp.send();

特别注意，如果用这种方法调用php文件，切记在表单中的action值一定要设为空值，否则会出现错误

以下是js脚本的完整代码：

<script  src="jquery-3.3.1.JS"></script>
<script>
     if (window.XMLHttpRequest) {
     // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
    xmlhttp=new XMLHttpRequest();
                                }   
    else {
    // IE6, IE5 浏览器执行代码
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
    function showHint(str){
    xmlhttp.onreadystatechange=function()
    /*onreadystatechange此函数意思为当服务器响应
    已经做好被处理的准备是做出的响应*/
    {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    /*readystate的值为4或status为200
    时代表服务器可以与之通信*/
    {
    $text=xmlhttp.responseText;
    alert($text);
    }
    }
    xmlhttp.open("GET","登录1.php?q="+str,true);
    xmlhttp.send();
}
</script>

简单来说，就是

1. 写出相应的html代码，切记表单中action值为空；
2. 调用jQuery脚本，并重新开始script语句；
3. 写出不同浏览器下的执行代码；
4. 写出自己所需要的函数即调用自己的函数；
   在此函数下面要写出
   ①.服务器已经准备相应的函数
   ②判断服务器是否可以与之通信，若可以，则进行自己所需要的函数代码，否则。跳出，不执行代码，
5. 写出ajax语句
   到此，js关于ajax的脚本就写完了，剩下的是交给php文件进行处理数据、

php部分
通过？的方式将参数传到php文件中，
首先获取所传参数
代码如下：

$num=$_GET['q'];//这里传入的是q的值，并赋给num

再根据自己的需求写自己的代码

然后向html页面输出结果

首先让$response获得所需输出结果值；
再通过echo $response来向html页面输出结果值
完整代码如下：

<?php
$num=$_GET['q'];
$response="$num";
echo $response;
?>

注意这一段php代码必须有头有尾即以<?php开头，要以?>结尾；

输出的结果值怎么获取呢？
那就要通过js脚本里的

xmlhttp.responseText;

来获取，即刚刚在php里的$response，现在

xmlhttp.responseText;

就获取了$response的值，现在若是想对此值做相关操作，建议把此值赋给一个变量，方便操作。
代码 如下：

$text=xmlhttp.responseText;