zoukankan      html  css  js  c++  java
  • 使用AJAX如何得到数据库当中的值!

    首先还是在数据库当中新建一张表,在新建的页面上写上连接数据库的代码,我这里是以点击名字就出现一个DIV,DIV里面就显示你的数据库当中的所有的内容!

    每句代码我都写的注释,具体代码如下所示:

     1 <html>
     2 <head>
     3     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
     4 </head>
     5 
     6 <body>
     7 
     8 <?php
     9 $conn = mysql_connect("localhost","root","") or die("数据库连接失败".mysql_error());
    10 mysql_select_db("test");
    11 mysql_query("set names 'utf8'");//链接数据库代码;
    12 
    13 $sql = "select id,userName from users";//查询数据库当中表
    14 
    15 $result = mysql_query($sql);//返回一个资源类型;
    16 while($row = mysql_fetch_array($result)){//使用循环打印出来所有的内容;
    17     echo "<a href='javascript:queryDetail($row[id])'>".$row['userName']."</a> &nbsp;&nbsp;&nbsp;&nbsp;";//使用数据库当中的名字用A标签,我们要用他点击去
    18 显示一个DIV,DIV的内容就是我们在数据库当中写的值;
    19 
    20 }
    21 
    22 ?>
    23 </body>
    24 
    25 
    26 
    27 
    28 <script>
    29     var xmlHttp;//使用AJAX声明;
    30     function queryDetail(id){//写一个函数,给他一个参数;
    31         if(window.ActiveXObject){//判断浏览器有没有ActiveXObject,现在IE是用的一个控件方式提醒,
    32             xmlHttp = new ActiveXObject("MICROSOFT.XMLHTTP");
    33         }else if(window.XMLHttpRequest){
    34             xmlHttp = new XMLHttpRequest();
    35         }
    36 
    37         if(!xmlHttp){
    38             alert("没有获取到对象!");
    39             return;//判断有没有得到对象;//IE十以下的版本没有这个对象;
    40         }
    41 
    42         //由于javascript是没有办法连接数据库的,所以,需要通过后台语言
    43         //结合来连接数据库,那么这里就是把js从界面获取的值,传递给后台程序
    44         //xmlHttp.open()其实也就是链接到一个后台程序,把值传递过去
    45         //这其实是第一步
    46         xmlHttp.open("GET","queryById.php?id="+id,true);//链接到另一个页面上去!
    47 
    48         //这是第三步
    49         //这一步是一个回调函数,回调函数其实就和打电话代办事情是一个意思
    50         //这个回调函数其实就是状态改变的时候,js应该做什么事情
    51         xmlHttp.onreadystatechange = function(){
    52             if(xmlHttp.readyState == 4){//完成
    53                 if(xmlHttp.status == 200){//成功
    54                     var txt = xmlHttp.responseText;
    55                     var show = document.getElementById("show");//获取ID;
    56 
    57                     if(show){//判断
    58                         show.innerHTML = txt;//先放到我们的DIV里面去;
    59                         document.body.removeChild(strs);//当我们点击第二个名字的时候就删除掉;
    60                     }else{
    61                         var d = document.createElement("div");//使用DOM创建一个DIV;
    62                         d.id = "show";//使用JS dom给d一个ID为show,
    63                         d.style.cssText="200px;height:300px;border:1px solid red;";//给DIV一个样式;
    64                         var strs = txt.split(",");//分割字符串;
    65 
    66 //                        alert(strs);
    67 
    68                         for(var i=0;i<strs.length;i++){//判断我们分割的字符串,
    69                             d.innerHTML += strs[i]+",";把我们数据库当中的值放到DIV里面去;
    70                         }
    71                         document.body.appendChild(d);//把我们生成的DIV放到页面上去;
    72                     }
    73                 }
    74             }
    75         }
    76         //注意,open()方法就仅仅只是打开了连接,并没有传递,所以需要send方法
    77         //这是第二步
    78         xmlHttp.send(null);
    79     }
    80 </script>
    81 
    82 
    83 </html>

    接下来是另一个页面,这个页面同样要写上链接数据库的代码,查询语句,以及使用isset判断有没有值,以及使用什么方式来接收他,A标签和JS是使用GET方式,

    单纯的接收或者跳转到另一个页面上去就使用post方式来接收他:

    具体代码如下所示:

     1 <?php
     2 
     3 if(isset($_GET['id'])){//判断有没有值布尔值;
     4     $id = $_GET['id'];//接收传过来的ID应为我们是通过ID来寻找我们在数据库当中的内容的;
     5 
     6     $conn = mysql_connect("localhost","root","") or die("数据库连接失败".mysql_error());
     7     mysql_select_db("test");
     8     mysql_query("set names 'utf8'");//以上是连接数据库的代码;
     9 
    10     $sql = "select * from users where id=$id";//查询数据库当中的表的ID,
    11 
    12     $result = mysql_query($sql);//返回资源类型
    13     $row = mysql_fetch_row($result);//打印一行;
    14     $arr = "";//声明一个名字
    15     for($i=0;$i<count($row);$i++){//判断是不是小于一行,count计数;
    16         $arr .=$row[$i].",";//将数据库的内容先拼成一个字符串;
    17     }
    18 
    19     echo $arr;//打印出ARR结果;
    20 }
    21 
    22 
    23 ?>
  • 相关阅读:
    POJ3268-Silver Cow Party-(Dijstra)
    POJ3259-Wormholes-( spfa || Bellman_Ford )
    POJ2139-Six Degrees of Cowvin Bacon-(Floyd_Warshall)
    hdu3974-Assign the task-(dfs+线段树)
    ZOJ3261-Connections in Galaxy War-(逆向并查集+离线处理)
    hdu1540-Tunnel Warfare-(线段树+二分)
    hdu4027-Can you answer these queries? -(线段树+剪枝)
    POJ3616-Milking Time-(dp)
    Visual Studio Code
    Visual Studio Code
  • 原文地址:https://www.cnblogs.com/ws3366/p/3716408.html
Copyright © 2011-2022 走看看