java+jsp 浏览某个文件夹下图片(实现分页和浏览特效)

最新推荐文章于 2022-03-05 04:43:29 发布

置顶玉麟龙

最新推荐文章于 2022-03-05 04:43:29 发布

阅读量4.9k

点赞数

分类专栏： java+jsp 文章标签： java jsp recursion string list stylesheet

本文链接：https://blog.csdn.net/liangyulong419/article/details/7091011

版权

java+jsp 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

今天上午不是很忙，浏览QQ空间照片时，突然想到，自己可以做一个类似的，以后可能用得到，就是浏览某个文件夹下所有图片，并实现分页(此处分页比较简单，利用List分页)及浏览特效！(这里传不成实例，需要的Q我，QQ：295047822)具体效果如下图：

都是美女额，呵呵，点击任意一张图片时，出现浏览特效，如下图：

点击图片左侧或右侧，可浏览上一张或下一张照片。

效果看把，直接上代码，上代码之前废话一下，说一处关键的地方：

data=recursion(strRealPath+picPath,true,0);

此处的第一个参数表示路径(d:/a)，第二个参数表示是否浏览子目录，如d:/a/aa/,设置成true，表示aa目录下的图片，一起浏览，显示出来；第三个参数永远为0就好，为什么，我懒得说了，呵呵，，

下面看代码吧，注释已经很详细了。

<%@ page language="java" import="java.util.*,java.io.File" pageEncoding="GBK"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>文件夹下图片浏览器</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
		<link rel="stylesheet" href="pic-view/pic-css/lightbox.css" type="text/css" media="screen" />
	
	<script src="pic-view/pic-js/prototype.js" type="text/javascript"></script>
	<script src="pic-view/pic-js/scriptaculous.js?load=effects" type="text/javascript"></script>
	<script src="pic-view/pic-js/lightbox.js" type="text/javascript"></script>
	<style type="text/css">
	<!--
	.thumbnail {
		BORDER-RIGHT: #c1c1c1 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: #c1c1c1 1px solid; PADDING-LEFT: 3px; FLOAT: left; MARGIN-BOTTOM: 10px; PADDING-BOTTOM: 8px; BORDER-LEFT: #c1c1c1 1px solid; MARGIN-RIGHT: 10px; PADDING-TOP: 3px; BORDER-BOTTOM: #c1c1c1 1px solid; BACKGROUND-COLOR: #c1c1c1
	}
	.STYLE1 {color: #FF0000}
	.STYLE2 {color: #CC0000}
	.STYLE3 {color: #FF0000; font-weight: bold; }
	-->
	</style>
  </head>
 
  <body>
   	 <%
   	 /***
   	 ** 梁玉龙  javayulong@qq.com
   	 ** 2011-12-21 09:21:32
   	 ** content: 文件夹下图片实现浏览并分页效果
   	 */
  	String strRealPath = getServletContext().getRealPath("/");//得到项目的绝对路径
  	List data=null;
  	String picPath="images";
  	//out.println("strRealPath="+strRealPath);
 	data=recursion(strRealPath+picPath,true,0);//第一个参数图片文件夹路径,第二个参数只需设置true,或false,true表示也循环子目录下的图片，第三个参数默认为0即可,千万不要改动
 	//data=recursion("D:\\resin\\webapps\\PicList\\images",false);
 	if(data==null){out.println("该文件夹不存在!");return ;}
 	//	out.println("大小："+data.size());
 	//out.println("-----------------分页开始--------------------");
 	int pageSize=14;//每页显示多少条
 	int showPage=1;//第几页
 	int totle=data.size();//共有多少条数据(多少张照片)
 	String state="";
 	String upPage=request.getParameter("upPage");
 	String nextPage=request.getParameter("nextPage");
 	if(upPage!=null){
 		showPage=Integer.parseInt(upPage);
 	}
 	if(nextPage!=null){
 		showPage=Integer.parseInt(nextPage);
 	}
 	
  	if(data.size()>0){
			 if(totle%pageSize==0){
				  totlePage=totle/pageSize; //共有多少页
			  }
			  else{
				  totlePage=totle/pageSize+1;
			  }
			  //当前页小于等于第一页 则按第一页算 如果 当前页大于等于总页数则为最后页
			    if(showPage <=1){
			    	state="当前已是首页！";
			        showPage = 1;
			    }
			    else if(showPage >= totlePage){
			        showPage =  totlePage;
			        if(showPage==totlePage){ state="当前已是最后一页！";}
			        
			    }
%>
 <table border="0" align="center">
   	<tr>
   	<td align="center" colspan="8"><b>图片列表信息</b><hr/></td>
   	</tr>
<%
			  //System.out.println("共 "+totle+" 张图片, "+totlePage+" 页。当前"+showPage+"页，每页显示"+pageSize+"条");
			   //游标的位置 (当前页 - 1) * 页面大小 + 1
			  int posion = (showPage-1) * pageSize + 1;
			  int endData=pageSize*showPage;
			  for (int i = posion; i <= data.size(); i++) {
				  if(i>endData){
				  //out.println("break;---"+i);
					  break;
				  }
				  else{
				    	if((i-posion)%7==0){
				    		%>
				    		<tr>
				    		<%
						  }
						  %>
						  	<td align="center">
						  	<DIV class=thumbnail style="margin-left:0">
							  	<A  href="<%=basePath+data.get(i-1) %>" rel=lightbox[plants]>
							  	<img src="<%=basePath+data.get(i-1) %>" width="160" height="160" border="0"/>
							  	</A>
						  	</DIV>
						  	</td>
						  <%
						if((i-posion)%7==6){
						%>
							</tr>
						<%
						}

					  //out.println("图片：>>>"+data.get(i-1)+"\r\n");//有问题，要判断，小于4，
				  }
				  
			  }
		}
		else{
			out.println("该目录下没有图片");
		}
   %>
   	<tr>
	   	<td align="center" colspan="8" nowrap="nowrap" style="font-size: 12px;">
	   	图片数量: <font color="red"><%=data.size() %></font> 张,共 <font color="red"><%=totlePage %></font>  页,当前第 <font color="red"><%=showPage %></font> 页 
	   	<a href="index.jsp?upPage=<%=1 %>" style="text-decoration: none">首页</a> <a style="text-decoration: none" href="index.jsp?upPage=<%=showPage-1 %>">上一页</a> <a href="index.jsp?nextPage=<%=showPage+1 %>" style="text-decoration: none">下一页</a> <a href="index.jsp?nextPage=<%=totlePage %>" style="text-decoration: none">尾页</a> 
	   	跳转第 <input id="goPage" type="text" style="width:30px;text-align: center;" value="<%=showPage %>" /> 页 <input type="button" value="GO" οnclick="ck()"/>
	   	 <span><%=state %></span>
	   	</td>
   	</tr>
   </table>
   <%!
   //遍历某个目录下所有文件
  	  int folderCount;//文件夹个数
	  int fileCount;//文件个数
	  int picFilCount=0;//图片个数
	// 总共的数据量   (图片个数)
      int totle;   

    // 共有多少页   
      int totlePage;    
    // 数据   
      List list;
   /**
	 * 
	 * @param root 文件夹所在位置
	 * @param isBlAll 是否连子文件夹下的某个文件(图片)也遍历
	 * @param isrRef 可设为0或1,为0时，表示是翻页或刷新时请求，为1时表示循环内部所有文件夹时请求，我们调用时,只需要设置为0就ok，其他的不用操心
	 */
	public  List recursion(String root,boolean isBlAll,int isRef){
		if(isRef==0){
			list=new ArrayList();
		}
		//Java中读取某个目录下的所有文件和文件夹
		  String filePath=getServletContext().getRealPath("/");
		  String picPath=root.replace(filePath,"");
		  System.out.println("梁玉龙弄国际奥法"+picPath);
		 // String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
		  // System.out.println("梁玉龙弄国"+);
		  File file=new File(root);
		  if(file.isDirectory()){
		  File[] tempList = file.listFiles();
		  //System.out.println("该目录下对象个数："+tempList.length);
		  for (int i = 0; i < tempList.length; i++) {
			   if (tempList[i].isFile()) {
				fileCount++;
			    //System.out.println("文     件："+tempList[i]);
			    String fileName=tempList[i].getName();//文件名称
			    String hzm=fileName.substring(fileName.indexOf(".")+1,fileName.length()); //文件后缀名
			    hzm=hzm.toLowerCase();
			    if(hzm.equals("jpg")||hzm.equals("bmp")||hzm.equals("gif")||hzm.equals("png")){
			    	picFilCount++;
			    	//list.add(tempList[i]);//这里要注意，data.add(fileName);
			    	list.add(picPath+"\\"+fileName);
			    }
			   // System.out.println("名称"+hzm);
			   }
			   if (tempList[i].isDirectory()) {
				 folderCount++;
				 //System.out.println("文件夹："+tempList[i]);
				 if(isBlAll){
					 recursion(tempList[i].getAbsolutePath(),isBlAll,1);
				 }
			  
			   }
		  }
		  totle=picFilCount;
		 // System.out.println("文件夹个数："+folderCount+"\r\n文件个数："+fileCount+"\r\n图片个数："+picFilCount);
			return list;
		}
		else{
			return null;
		}
	}
	
   
    %>
  </body>
  <script type="text/javascript">
  function ck(){
  var va=document.getElementById("goPage");
  var strPage=va.value.replace( / /g,""); 
  if(strPage==""){alert("跳转的值不能为空!");return ;}
  if(isNaN(va.value)){alert("跳转的值必须为数字!");return ;}
   window.location.href="index.jsp?nextPage="+va.value;
  }
  </script>
</html>

玉麟龙

关注

0
点赞
踩
13

收藏

觉得还不错? 一键收藏
28
评论
java+jsp 浏览某个文件夹下图片(实现分页和浏览特效)

今天上午不是很忙，浏览QQ空间照片时，突然想到，自己可以做一个类似的，以后可能用得到，就是浏览某个文件夹下所有图片，并实现分页(此处分页比较简单，利用List分页)及浏览特效！(这里传不成实例，需要的Q我，QQ：295047822)具体效果如下图：都是美女额，呵呵，点击任意一张图片时，出现浏览特效，如下图：点击图片左侧或右侧，可浏览上一张或下一张照片。效果看把，直接上代码，上代
复制链接

扫一扫

专栏目录