标签:
学习:查询好友列表
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>练习数据库与网页布局</title> <style> * { marger:0px auto; padding:0px; } .hy { width:200px; height:50px; margin-top:5px; } /* //使用下边的js之后,这些就不用了 .hy:hover { background-color:#999; cursor:pointer; } */ .pic { width:50; height:50px; float:left; } .nk { height:50px; width:130px; float:left; margin-left:20px; line-height:50px; vertical-align:middle; } </style> </head> <body> <?php $uid="18653378660"; ?> <?php $db=new MySQLi("localhost","root","","mydb"); $sql="select friends from friends where uid=‘18653378660‘"; $result = $db->query($sql); $attr=$result->fetch_all(); foreach($attr as $v) { $fuid=$v[0];//好友的用户名 //根据用户名查询users表的昵称和头像 $sqlu="select nickname pic from users where uid=‘{$fuid}‘"; $r=$db->query($sqlu); $attr=$r->fetch_row(); echo "<div class=‘hy‘ onclick=‘select(this)‘> <div class=‘pic‘><img width=‘50px‘ height=‘50px‘ src=‘{$attr[1]}‘/></div> <div class=‘nk‘>{$attr[0]}</div> </div>"; } ?> </body> <script type="text/javascript"> function select(aa) //aa代表该div { //清除原选中状态 var div=document.getElementsByClassName("hy"); for(var i=0;i<div.length;i++) { div[i].style.backgroundColor="white"; div[i].style.color="#000000"; } //设置选中 aa.style.bachgroundcolor="#60c"; aa.style.color="while"; } </script> </html>
标签:
原文地址:http://www.cnblogs.com/zst062102/p/5463768.html