如何在JSP中動態檢索和顯示圖像？

Question

我正在使用Java Servlets和JSPs從事E-commerce project 。 但是，在從數據庫到網頁檢索產品的圖像時，我陷入了困境。 我的數據訪問層返回包含緩沖圖像數組的產品對象。 問題是我無法在img標簽中顯示這些圖像。 注意：我已經測試了數據訪問層，並且可以正常工作。 這是product.jsp的代碼，應在其中顯示產品信息：

    <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ page import= "java.util.ArrayList, com.ecommerce.models.*, com.ecommerce.dao.*, org.apache.taglibs.standard.*, java.awt.image.BufferedImage"%> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script data-require="jquery@3.1.1" data-semver="3.1.1" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="script.js"></script>

    <link rel="stylesheet" type="text/css" href="styles/normalize.css">
    <link rel="stylesheet" type="text/css" href="styles/product.css">
    <link rel="stylesheet"
    href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link
     href='http://fonts.googleapis.com/css?family=Lato:100,300,400,300italic'
     rel='stylesheet' type='text/css'>

    <title>Product-name</title>
    </head>
     <body>

     <%
    Product product = (Product) session.getAttribute("product");
    ImageDAO imagedao = new ImageDAO();
    ArrayList<BufferedImage> images = imagedao.getImages(product.getId());

%>
<div class="topnav">
    <a href="#"><img class="cart-icon" src="images/shopping-cart.png"></a>
    <img class="logo" src="images/logo.png" alt="Fashion Station Logo">
</div>

<div class="product-box">
    <div class="img-view">
    <img class="product-img" src="#">
    <img class="product-img" src="#">
    </div>

    <h3>Product Name</h3>


    <div class="quantity buttons_added">
        <label>Quantity</label>
        <input type="button" value="-" class="minus"><input type="number" step="1" min="1" max="" name="quantity" value="1" title="Qty" class="input-text qty text" size="4" pattern="" inputmode=""><input type="button" value="+" class="plus">
</div>
    <h4>Price: $99</h4>
    <button class="btn">Add to cart</button>



<div class="description-box">
    <h3>Description</h3>
    <p>Introducing our Blood Sugar Palette from the Love Sick Collection! 

    Featuring 18 striking eyeshadows and pressed-pigments. This palette is serving three luxurious formulas: matte, metallic and pressed glitter. This palette is not for the faint of heart! A luxurious red faux leather finish with a metal clasp.

 SHADE NAMES
 Row 1: Glucose, Sugarcane, Cake Mix, Ouch, Donor, Intravenous
 Row 2: Candy Floss, Tongue Pop, Sweetener, Cavity, O Positive, Root Canal
 Row 3: Prick, Cherry Soda, Fresh Meat, Blood Sugar, Extraction, Coma

 One of a kind. Extreme payoff.
 *VEGAN. CRUELTY-FREE.
  </p>
    </div>
   </body>
   </html>

Answer 1

您可以在頁面加載時使用JQuery嘗試獲取呈現的圖像。

我會將ID分配給圖像標簽（例如img1和img2），即

<img id="img1" class="product-img" src="">
<img id="img2" class="product-img" src="">

然后執行以下操作：

$("#img1").attr("src",images[0]);
$("#img2").attr("src",images[1]);

如何在JSP中動態檢索和顯示圖像？

問題描述

1 個解決方案

解決方案1
0 2018-09-06 10:24:44

如何在JSP中動態檢索和顯示圖像？

問題描述

1 個解決方案

解決方案1 0 2018-09-06 10:24:44

解決方案1
0 2018-09-06 10:24:44