AJAX实现的电子相册功能

最新推荐文章于 2023-03-20 09:00:00 发布

ningyuxin

最新推荐文章于 2023-03-20 09:00:00 发布

阅读量887

点赞数

分类专栏： ajax 文章标签： Ajax Java Webwork XML JSP

ajax 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

表现层：

<%@ page language="java" pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<html>
<head>
<title>电子相册 </title>
<script type="text/javascript">
var selected = 0;
//定义一个变量用于存放XMLHttpRequest对象
var xmlHttp;
//该函数用于创建一个XMLHttpRequest对象
function createXMLHttpRequest(){
         if(window.ActiveXObject){
             xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
         }else if(window.XMLHttpRequest){
             xmlHttp = new XMLHttpRequest();
         }
}
//这是一个启动AJAX异步通信的方法
function getPhoto(){

  //创建一个XMLHttpRequest对象
  createXMLHttpRequest();
  //将状态触发器绑定到一个函数
  xmlHttp.onreadystatechange = processor;
  //通过GET方法向指定的URL建立服务器的调用
  xmlHttp.open("GET","/getPhoto.action?selected="+selected);
  //发送请求
  xmlHttp.send(null);
}
//这是一个用来处理状态改变的函数
function processor(){
  //定义一个变量用于存放从服务器返回的响应结果
  var responseContext;
  if(xmlHttp.readyState == 4){//如果响应完成
    if(xmlHttp.status == 200){//如果返回成功
     //取出服务器的响应内容
     responseContext = xmlHttp.responseText;
     document.all.photo.src = responseContext;
              }
  }
}
//"响应上一张
   function prev(){
  selected = (selected-1+5)%5;
  getPhoto();
}
   //"响应下一张
   function next(){
  selected = (selected+1+5)%5;
  getPhoto();
}
</script>
</head>
<body>
   <center>
    <table border="0" bgcolor="#c0c0c0" width="300px" height="240px">
  <tr><td colspan="2" align="center"><h2>电子相册</h2></td>
    </tr>
   <tr><td colspan="2" align="center"><img id="photo" src="/images/photo/photo1.gif"></td>
    </tr>
<tr>
       <td align="center"><span onClick="prev();" style="cursor:hand;">上一张 </span></td>
       <td align="center"><span onClick="next();" style="cursor:hand;">下一张 </span></td>
    </tr>
   </table>

   </center>
</body>
</html>

<%@ page language="java" pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
${photoUrl}

控制层

package com.dicorp.ajax.ajax_web.actions;

import java.io.File;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.Properties;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/*import javax.xml.parsers.DocumentBuilder;
import javax.xml.parsers.DocumentBuilderFactory;
import javax.xml.transform.OutputKeys;
import javax.xml.transform.Transformer;
import javax.xml.transform.TransformerFactory;
import javax.xml.transform.dom.DOMSource;
import javax.xml.transform.stream.StreamResult;
*/
/*import org.jdom.Document;
import org.jdom.Element;
import org.jdom.output.Format;
import org.jdom.output.XMLOutputter;
import org.w3c.dom.CDATASection;
import org.w3c.dom.Comment;
import org.w3c.dom.ProcessingInstruction;
import org.w3c.dom.Text;
*/

import com.dicorp.ajax.ajax_web.createXMLUtils.CreateCounterXMLUtil;
import com.opensymphony.webwork.ServletActionContext;
import com.opensymphony.webwork.interceptor.ServletRequestAware;
import com.opensymphony.webwork.interceptor.ServletResponseAware;
import com.opensymphony.xwork.Action;
import com.opensymphony.xwork.ActionContext;

import   javax.xml.transform.*;
import   javax.xml.transform.dom.*;
import   javax.xml.transform.stream.*;
import   org.w3c.dom.*;
import   java.io.*;
import java.net.URI;

import javax.xml.parsers.*;
import java.util.*;

public class GetPhotoAction implements Action ,ServletResponseAware,ServletRequestAware{
    private String selected;
private HttpServletResponse response;
private HttpServletRequest request;
    private String photoUrl ;

/* (non-Javadoc)
* @see com.opensymphony.xwork.Action#execute()
*/
public String execute() throws Exception {
   String[] photos = {
     "/images/photo/photo1.gif",
     "/images/photo/photo2.gif",
     "/images/photo/photo3.gif",
     "/images/photo/photo4.gif",
     "/images/photo/photo5.gif",
   };
   System.out.println("&**&*&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&"+selected);
    int index = Integer.parseInt(selected);
    System.out.println("&**&*&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&"+ photos[index]);
    photoUrl = photos[index];
     return SUCCESS;
}
public String getPhotoUrl() {
  return photoUrl;
}
public void setPhotoUrl(String photoUrl) {
  this.photoUrl = photoUrl;
}
public String getSelected() {
  return selected;
}
public void setSelected(String selected) {
  this.selected = selected;
}
public void setServletResponse(HttpServletResponse response) {
   this.response = response;
}

public void setServletRequest(HttpServletRequest request) {

  this.request = request;
   }
}

ningyuxin

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
AJAX实现的电子相册功能

表现层：&lt;%@ page language="java" pageEncoding="UTF-8" %&gt;&lt;%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %&gt;&lt;%@ taglib uri="http://java.sun.com/jsp/jstl/functions&quot
复制链接

扫一扫