ajax图片显示有关问题
日期：2014-05-16 浏览次数：20683 次
用ajax从后台获取到数据后怎么在页面显示，
?
现在数据已经获取到了，问题是要怎样显示
?
第一次查询到的数据是用servlet查询，然后用list迭代出来的
点击下一页的时候要怎样替换原来的图片呢？
各位大虾给点建议
?
再问下，ajax获取到的数据可以放入到我第一次查询用的list里面么？
?
页面代码如下，谢谢了
?
<%@ page language="java"
?import="java.util.*,com.ibm.vo.PhotoVO,com.ibm.common.Page"
?pageEncoding="GB18030"%>
<!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=GB18030"></meta>
??<title>相片详细</title>
??<style type="text/css">
<!--
.STYLE15 {
?font-size: 12px;
?color: #999999;
}
.STYLE16 {
?color: #FF0000
}
#Layer1 {
?position: absolute;
?left: 905px;
?top: 303px;
?width: 30px;
?height: 30px;
?z-index: 1;
}
body {
?background-repeat: no-repeat;
}
.STYLE21 {
?font-size: 12px
}
a:link {
?font-size: 12px;
?text-decoration: none;
}
a:hover {
?font-size: 14px;
?text-decoration: none;
}
a:active {
?font-size: 14px;
?text-decoration: none;
}
.STYLE24 {
?font-size: 12px;
?color: #0066FF;
}
.STYLE26 {
?font-size: 14
}
.table {
table-layout: fixed;
word-wrap:break-word;
}
.div {
word-wrap:break-word;
}
-->
</style>
?<%
??Integer currow = (Integer) session.getAttribute("currow");
??Integer maxRow = (Integer) session.getAttribute("maxrow");
??Page pageCtrl = (Page) session.getAttribute("page");
??List<PhotoVO> list = (List<PhotoVO>) session.getAttribute("list");
??PhotoVO photo = (PhotoVO) session.getAttribute("photo");
?%>
??<script type="text/javascript"><!--
?function getNext() {
???? var url = "../DetailListPhoto?currow=<%=(currow - 8) > 0 ? (currow - 8) : 0%>";
???? if (window.XMLHttpRequest) {
???????????? req = new XMLHttpRequest();
???? }else if (window.ActiveXObject) {
???????????? req = new ActiveXObject("Microsoft.XMLHTTP");
???? }
???? if(req){
???????????? req.open("GET",url, true);
???????????? req.onreadystatechange = complete;
???????????? req.send(null);
???? }
?}
?var name=[];
?var id=[];
?var url=[];
?function complete(){
???? if (req.readyState == 4) {
???????????? if (req.status == 200) {
??????????? //alert(req.responseText);
??????????? //$("#photolist").html(req.responseText);
???var city = req.responseXML.getElementsByTagName("photo");
???//alert(city);
???????????????????? var str=new Array();
?????????? var result="";
???????????????????? for(var i=0;i<city.length;i++){
???????????????????????????? //str[i]=city[i].firstChild.data;
????????????? // alert(str[i]);
???????????? // alert(city[i].getElementsByTagName("name")[0].firstChild.nodeValue);
??? ???? id[i]= city[i].getElementsByTagName("pid")[0].firstChild.nodeValue;
?????????????? name[i]= city[i].getElementsByTagName("name")[0].firstChild.nodeValue;
?? ????? url[i]= city[i].getElementsByTagName("url")[0].firstChild.nodeValue;
?? ???? // result='<a href="../DetailPhoto?id='+id[i]+'"><img src="'+url[i]+'" alt="'+name[i]+'" width="95" height="93" border="0"></a>';
???? ? //? document.getElementById("listphoto").innerHTML=result;
???????????????????? }
???? for (var i=0;i<id.length;i++)
???? {
?????? result +='<a href="../DetailPhoto?id='+id[i]+'" title="'+name[i]+'"><img src="'+url[i]+'" width="95" height="93" border=
