首先还是在数据库当中新建一张表,在新建的页面上写上连接数据库的代码,我这里是以点击名字就出现一个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> ";//使用数据库当中的名字用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="width: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 ?>