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 ?>
  • 相关阅读:
    LeetCode Flatten Binary Tree to Linked List
    LeetCode Longest Common Prefix
    LeetCode Trapping Rain Water
    LeetCode Add Binary
    LeetCode Subsets
    LeetCode Palindrome Number
    LeetCode Count and Say
    LeetCode Valid Parentheses
    LeetCode Length of Last Word
    LeetCode Minimum Depth of Binary Tree
  • 原文地址:https://www.cnblogs.com/ws3366/p/3716408.html
Copyright © 2011-2022 走看看