图片上一个下一个轮换效果
wp_442057835_jquery.php(解1)
1 <html> 2 <head> 3 <title>wp_442057835_jquery</title> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <meta http-equiv="Content-Language" content="zh-CN" /> 6 <script type="text/javascript" src="https://files.cnblogs.com/Zjmainstay/jquery-1.6.2.min.js"></script> 7 </head> 8 <body> 9 10 <script> 11 $(document).ready(function(){ 12 $("#last_pic").click(function(){ 13 var q=1; 14 var userid=$("#user_pic").attr("imgid"); 15 $.ajax({ 16 url:"wp_442057835_process.php?q="+q+"&u="+userid+"&sid="+Math.random(), 17 type:'GET', 18 success:function(userid){ 19 $("#user_pic").attr('imgid',userid); 20 $("#user_pic").attr('src',"user_pic/"+userid+".jpg"); 21 } 22 }); 23 }); 24 $("#next_pic").click(function(){ 25 var q=2; 26 var userid=$("#user_pic").attr("imgid"); 27 $.ajax({ 28 url:"wp_442057835_process.php?q="+q+"&u="+userid+"&sid="+Math.random(), 29 type:'GET', 30 success:function(userid){ 31 $("#user_pic").attr('imgid',userid); 32 $("#user_pic").attr('src',"user_pic/"+userid+".jpg"); 33 } 34 }); 35 }); 36 }); 37 </script> 38 <span id="last_pic" class="pic_a" >上一张</span> 39 <img src="<?php echo "user_pic/1.jpg" ?>" alt="修改头像" id="user_pic" width="200px" height="100px" imgid="1"/> 40 <span id="next_pic" class="pic_a">下一张</span> 41 </body> 42 </html>
wp_442057835(解2)
1 <html> 2 <head> 3 <title>wp_442057835</title> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <meta http-equiv="Content-Language" content="zh-CN" /> 6 </head> 7 <body> 8 <script> 9 function last_pic() { 10 userid = document.getElementById("user_pic").getAttribute("imgid"); //使用imgid存储当前照片id 11 xmlHttp=GetXmlHttpObject(); 12 if (xmlHttp==null) { 13 alert ("Browser does not support HTTP Request"); 14 return null; 15 } 16 var q="1"; 17 var url="wp_442057835_process.php?q="+q+"&u="+userid+"&sid="+Math.random(); 18 xmlHttp.onreadystatechange=stateChanged; 19 xmlHttp.open("GET",url,true); 20 xmlHttp.send(null); 21 } 22 function next_pic() { 23 userid = document.getElementById("user_pic").getAttribute("imgid"); 24 xmlHttp = GetXmlHttpObject(); 25 if (xmlHttp == null) { 26 alert("Browser does not support HTTP Request"); 27 return null; 28 } 29 var q = "2"; 30 var url = "wp_442057835_process.php?q=" + q + "&u=" + userid + "&sid=" + Math.random(); 31 xmlHttp.onreadystatechange = stateChanged; 32 xmlHttp.open("GET", url, true); 33 xmlHttp.send(null); 34 } 35 36 function stateChanged() { 37 if (xmlHttp.readyState == 4 || xmlHttp.readyState == "complete") { 38 var nuserid = xmlHttp.responseText; 39 var newImage = document.getElementById("user_pic"); 40 newImage.setAttribute("src", "user_pic/" + nuserid + ".jpg"); 41 newImage.setAttribute("imgid", nuserid); 42 } 43 } 44 function GetXmlHttpObject(){ 45 var request; 46 var browser = navigator.appName; 47 if(browser == "Microsoft Internet Explorer"){ 48 var arrVersions = ["Microsoft.XMLHTTP","MSXML2.XMLHttp.4.0", 49 "MSXML2.XMLHttp.3.0","MSXML2.XMLHttp.5.0"]; 50 for(var i=0;i < arrVersions.length;i++){ 51 try{ 52 request = new ActiveXObject(arrVersions[i]); 53 return request; 54 }catch(exception){ 55 //忽略，继续 56 } 57 } 58 }else{ 59 request = new XMLHttpRequest(); 60 return request; 61 } 62 } 63 </script> 64 <div id = "pic_show" > 65 <a href = "javascript:;"onclick = "last_pic(); return false;" > 上一张 </a> 66 <img src="<?php echo "user_pic/1.jpg " ?>"alt = "修改头像"hspace = "7"id = "user_pic"width = "200px"height = "100px"imgid = "1" /> 67 <a href = "javascript:;"onclick = "next_pic(); return false;" > 下一张 </a> 68 </body> 69 </html>
wp_442057835_process.php
1 <?php 2 header("content-type:text/html;charset=utf-8"); 3 include("db.php"); 4 //echo $_GET["q"]; 5 //echo $_GET["u"]; 6 $userid=$_GET["u"]; 7 if($_GET["q"]==1) { 8 $lquery=mysql_query("SELECT * FROM usermember WHERE userid < $userid ORDER BY userid DESC LIMIT 0,1 "); 9 $last_user =mysql_fetch_object($lquery); 10 $last_userid=$last_user->userid; 11 if(empty($last_userid)) $last_userid = $userid; 12 echo $last_userid; 13 } 14 if($_GET["q"]=="2") { 15 $nquery=mysql_query("SELECT * FROM usermember WHERE userid > $userid ORDER BY userid ASC LIMIT 0,1 "); 16 $next_user =mysql_fetch_object($nquery); 17 $next_userid=$next_user->userid; 18 if(empty($next_userid)) $next_userid = $userid; 19 echo $next_userid; 20 }
table usermember
1 2 CREATE TABLE `usermember` ( 3 `id` int(11) NOT NULL AUTO_INCREMENT, 4 `userid` int(11) NOT NULL, 5 PRIMARY KEY (`id`) 6 ) ENGINE=InnoDB AUTO_INCREMENT=5 DEFAULT CHARSET=utf8 7 8 //数据 9 10 id userid 11 12 1 1 13 14 2 2 15 16 3 3 17 18 4 4
user_pic
1 1.jpg 2 3 2.jpg 4 5 3.jpg 6 7 4.jpg
