|
 |
| |
ช่วยดูให้หน่อยคับไม่รู้เป็นไร คือ ผมทำ slide ภาพโดยใช้ javascript,ajax คือ ผมรันใน google chrome |
| |
 |
|
|
 |
 |
|
google chrome,IE,Firefox ผมรันไม่ขึ้นครับ
|
 |
 |
 |
 |
| Date :
2009-09-15 23:14:59 |
By :
panyapol |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
แก้ link คับเป็น link นี้ http://www.banphusakaeratwannankhieo.com/view.php
|
| |
|
|
| |
| Date :
2009-09-15 23:17:23 |
By :
norland |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
รู้สึกชื่อเว็ปจะยาวมากเลยน่ะครับ 
|
| |
|
|
| |
| Date :
2009-09-15 23:18:04 |
By :
xbeginner01 |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ดูแล้วครับ ไม่ได้เหมือนเดิม
|
| |
|
|
| |
| Date :
2009-09-15 23:24:31 |
By :
panyapol |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
<!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=windows-874" />
<title>Untitled Document</title>
</head>
<style type="text/css">
.a{border-left-style:none;
border-right-style:none;
}
</style>
<script language="javascript">
var indexpage=1;
var checks;
var ch=0;
function Ajax(type)
{
var temp;
var url;
url="getpic.php?page="+type+"&t="+new Date().getTime();// ส่งหน้าไปเพื่อขอภาพ
if(window.XMLHttpRequest)
xmlReq=new XMLHttpRequest();
else
xmlReq=new ActiveXObject("Microsoft.XMLHTTP");
xmlReq.onreadystatechange=callBack;
xmlReq.open("GET",url,true);
xmlReq.send(null);
}
function callBack()
{
if(xmlReq.readyState==4)
{
if(xmlReq.status==200)
{
var xmlResult=xmlReq.responseXML;// ค่าของภาพกลับมาอยู่ในรูป xml
var pic=xmlResult.getElementsByTagName("pics");
var pic1=pic[0].getElementsByTagName("pic");
if(pic1[0].firstChild.nodeValue!="none")// ถ้าค่าเป็น none แสดงว่าไม่มีข้อมูลรูป
{
var pic2=pic[0].getElementsByTagName("pageall");
var temp=document.createTextNode(pic2[0].firstChild.nodeValue);
if(ch==0)
document.getElementById("pageall").appendChild(temp);
ch++;
checks="";
for(var i=0;i<=9;i++)
{
var index="p"+(i+1);
document.getElementById(index).removeAttribute("src");
document.getElementById(index).removeAttribute("onclick");
document.getElementById(index).setAttribute("src",pic1[i].firstChild.nodeValue);
document.getElementById(index).setAttribute("onclick","slide('"+index+"')");
// ตรงนี้คับประเด็นที่อยากรู้ ก็คือเมื่อได้ข้อมูลผมก็ทำการ set onclick ให้กับ tag img ข้างหลังที่ตั้ง id ไว้ผมลอง getAttribute onclick มาแสดงก็มีค่า แต่ลองคลิกเพื่อใช้งานใน ie ไม่ได้(ทั้งใน server,เครื่อง) แต่ google chrome ได้คับ(ทั้งใน server,เครื่อง) พอจะมีทางแก้ไม่คับ
}
}
else
{
alert("ไม่พบหน้าที่คุณต้องการเรียกดู");
if(checks==0)
indexpage++;
else
indexpage--;
checks="";
}
alert(document.getElementById("p1").getAttribute("onclick"));
}
}
}
function slide(pic)
{
document.getElementById("picbig").removeAttribute("src");
document.getElementById("picbig").setAttribute("src",pic);
}
function changepic(check)
{
if(check=='w')
document.getElementById("picbig").setAttribute("src","./picture/none.jpg");
if(check==0)
indexpage--;
else if(check==1)
indexpage++;
checks=check;
Ajax(indexpage);
}
</script>
<body onload="changepic('w')">
<table border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<th scope="col"><img src="head.png" border="0" usemap="#Map2" /></th>
</tr>
<tr>
<td height="521" background="body.png">
<!--------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
<table width="785" border="1" align="center" bordercolor="bbd979" cellpadding="0" cellspacing="0">
<tr>
<td height="415" colspan="12" scope="col" align="center"><img name="picbig" width="600" height="400" id="picbig" /></td>
</tr>
<tr>
<th width="74" height="36" scope="col"><input type="button" onclick="changepic('0')" value="<<back" /></th>
<th width="60" scope="col"><img id="p1" style="cursor:pointer" width="60" height="60"/></th>
<th width="60" scope="col"><img id="p2" style="cursor:pointer" width="60" height="60"/></th>
<th width="60" scope="col"><img id="p3" style="cursor:pointer" width="60" height="60"/></th>
<th width="60" scope="col"><img id="p4" style="cursor:pointer" width="60" height="60"/></th>
<th width="60" scope="col"><img id="p5" style="cursor:pointer" width="60" height="60"/></th>
<th width="60" scope="col"><img id="p6" style="cursor:pointer" width="60" height="60"/></th>
<th width="60" scope="col"><img id="p7" style="cursor:pointer" width="60" height="60"/></th>
<th width="60" scope="col"><img id="p8" style="cursor:pointer" width="60" height="60"/></th>
<th width="60" scope="col"><img id="p9" style="cursor:pointer" width="60" height="60"/></th>
<th width="60" scope="col"><img id="p10" style="cursor:pointer" width="60" height="60"/></th>
<th width="85" scope="col"><input type="button" value="next>>" onclick="changepic('1')" /></th>
</tr>
// ไอ้พวกนี้ คือ tag img ที่เอาไว้ใส่ข้อมูลที่ได้กลับมา
<tr>
<td height="30" colspan="6" style="border-right-style:none"></td>
<td height="30" colspan="2" align="right" class="a">มีรูปภาพทั้งหมด</td>
<td height="30" colspan="1" align="center" class="a"><div id="pageall"></div></td>
<td height="30" colspan="3" style="border-left-style:none" align="left">รูป แสดงหน้าละ 10 รูป </td>
</tr>
</table>
<!--------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
</td>
</tr>
<tr>
<td><img src="menu.png" border="0" usemap="#Map" /></td>
</tr>
</table>
<map name="Map" id="Map">
<area shape="rect" coords="176,-1,311,31" href="p1.html" />
<area shape="rect" coords="312,-1,444,29" href="place.php" />
<area shape="rect" coords="582,-1,715,29" href="view.php" /><area shape="rect" coords="718,-2,847,29" href="contact.html" />
<area shape="rect" coords="446,0,582,28" href="rateplace.html" />
</map>
<map name="Map2" id="Map2"><area shape="rect" coords="828,73,853,90" href="p1.html" />
<area shape="rect" coords="857,73,883,89" href="login.php" />
<area shape="rect" coords="887,72,909,92" href="contact.html" />
</map>
</body>
</html>
ข้อมูลที่ส่งกลับมาจะเป็นอย่างนี้
<?xml version="1.0" encoding="tis-620" ?>
- <pics>
<pic>./picture/pic2.jpg</pic>
<pic>./picture/pic1.jpg</pic>
<pic>./picture/none.jpg</pic>
<pic>./picture/none.jpg</pic>
<pic>./picture/none.jpg</pic>
<pic>./picture/none.jpg</pic>
<pic>./picture/none.jpg</pic>
<pic>./picture/none.jpg</pic>
<pic>./picture/none.jpg</pic>
<pic>./picture/none.jpg</pic>
<pageall>2</pageall>
</pics>
|
| |
|
|
| |
| Date :
2009-09-15 23:41:55 |
By :
norland |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
document.getElementById(index).setAttribute("onclick","slide('"+index+"')");
SetAttribute ใส่อีเวนไม่ได้นะครับ มันจะไม่ทำงาน
|
| |
|
|
| |
| Date :
2009-09-29 15:03:24 |
By :
เป้ |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 04
|
