繁体   English   中英

动态显示从数据库到jsp的多个图像?

[英]Dynamically display multiple images from database to jsp?

大家好,堆栈溢出者。

我被困在项目的某个部分,并且正在寻找一些建议。

我在jsp中有一个图库页面,该页面设置为根据用户的兴趣显示所有相册列表以及其中的照片。 当前已进行设置,因此无论选择哪个“照片”选项,都将使用该特定页面上的输出流解码将其重定向到另一个jsp。 但是,为了查看其他照片或图像,用户必须“返回”到图库页面,并为新照片选择其他图像。

有没有办法设置画廊页面,以便所有照片都可以动态显示在页面上,或者有可能在display.jsp页面上放置一些方向,以便用户可以简单地从一张照片单击到另一张照片?????

代码如下。

<div id="subSlideshow">
                <table>
                    <tr>
                        <td id="subpageSlideshow">
                            <table>
                                <tr>
                                    <td>
                                        <h1 id="subpageTitle">Galleries</h1>
                                            <form action="gallery" method="get">
                                                <%try{
                                                  Connection conn = GalleriesConnection.connect();
                                                  Statement st = conn.createStatement();
                                                  String sql = "SHOW TABLES IN GALLERIES;";
                                                  ResultSet rs = st.executeQuery(sql);
                                                  while(rs.next()){%>
                                                  <input class="wineDiv" type="submit" name="gallery" value="<%=rs.getString(1).toLowerCase() %>" />
                                                  <%} 
                                                  rs.close();
                                                  st.close();
                                                  GalleriesConnection.close(conn);
                                                  } 

                                                catch(Exception e){

                                                  }%>
                                            </form>
                                        <td>
                                    </tr>
                                <tr>                                    
                                    <td>
                                        <h1 id="subpageTitle">Images</h1>
                                        <form  action="pictures/display.jsp">
                                        <%try{
                                          Connection conn = GalleriesConnection.connect();
                                          Statement st = conn.createStatement();
                                          String sql = "SELECT PHOTO_NAME FROM "+gallery+" ;";
                                          ResultSet rs = st.executeQuery(sql);

                                          while(rs.next()){   
                                          String photoName = rs.getString(1);
                                          %>
                                            <input class="wineDiv" type="submit" name="photo" value="<%=photoName %>" />  
                                        <%   }
                                          rs.close();
                                          st.close();
                                          GalleriesConnection.close(conn);

                                        } catch(Exception e){                                               
                                        }%>
                                        </form>
                                    </td>
                                </tr>
                            </table>    


                        </td>
                        <td id="subpageInfo">
                            <h1 id="subpageTitle">Click on an image to see a larger view</h1>
                            <div id="slider">
                             <script src ="js/slides.js" type="text/javascript"></script>
                                <img id="1" src="pictures/winery_image1.jpg"  />
                                <img id="2" src="pictures/winery_image2.jpg" />
                                <img id="3" src="pictures/winery_image3.jpg" />
                                <img id="4" src="pictures/winery_image4.jpg" />
                                <img id="5" src="pictures/winery_image5.jpg" />
                            </div>   

                            <input class="previous" onclick="prev(); return false;" value="Previous Image" />
                            <input class="next" onclick="next(); return false;" value="Next Image" />                                               
                        </td>
                    </tr>
                </table>
            </div> 

页面上的所有操作都在此div内。 第一个连接命令检索数据库中的所有表名,并在提交按钮上吐出表名。 另外,当前在subpageInfo中列出的图像是希望从数据库中嵌入图像的位置之一。 当选择了下一个和上一个按钮时,它们会产生一个很好的fadeOut()fadeIn()过渡。

第二个连接获取照片的所有名称,并将它们也以提交的形式放置。 选定的照片名称将发送到此页面:

<%@ page import="java.sql.*"%>
<%@ page import="java.io.*"%>

<% 
 byte[] imgData = null;
%>
<jsp:scriptlet>
String photo = request.getParameter("photo");
</jsp:scriptlet>
<%
try {
Class.forName("com.mysql.jdbc.Driver");
Connection con = DriverManager.getConnection("jdbc:mysql://localhost:8889/GALLERIES","myusername","mypassword");
Statement stmt = con.createStatement();
ResultSet rs = stmt.executeQuery("SELECT PHOTO FROM PHOTOS WHERE PHOTO_NAME = '"+photo+"';");

while (rs.next()) {
Blob image = rs.getBlob(1);
imgData = image.getBytes(1,(int)image.length());
}  
// display the image
response.setContentType("image/png");
OutputStream o = response.getOutputStream();
o.write(imgData);
o.flush();
o.close();

rs.close();
stmt.close();
con.close();
} catch (Exception e) {
out.println("Unable To Display image");
out.println("Image Display Error=" + e.getMessage());
return;
} 
%>

该程序可以完成要求执行的所有操作,但是在使其变得更加用户友好方面有些困难。 所需的效果是将图像嵌入到subpageInfo div中,或者在display.jsp页面上具有一些指令以从一个图像转到另一个图像。

与往常一样,我们非常感谢任何帮助。

如果您想展示一组照片,我会去:

http://lokeshdhakar.com/projects/lightbox2/

或者,如果您想自己做所有事情,请仅使用一页-使用您提到的选择表单,并在摘要后将包含解码图像的同一页面重新加载到其中。 您可以设置一个javascript,以便每次用户选择要提交表单的其他图片时,用户不必单击“提交”。

但我建议重新考虑整个问题。 你的目标是什么? 这是最好的方法吗? 我通常对技术方面的知识太了解,看不到用户期望的解决方案。 这就是为什么我要求随便的人来帮助我。

还-脚本? EW! 使用JSTL并准备控制器中的所有内容。 或使用Primefaces,JSF,托管bean以及为此目的制作的所有东西。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM