前后端傳值(jsp+ajax+jstl)

處理流程(不清楚spring的流程),所以現(xiàn)階段采用了傳統(tǒng)的處理流程

  1. 通過ajax 響應(yīng)前端的onload事件,然后發(fā)送請求

onload方法的標(biāo)簽有:<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>

<script >
    function getStreamingMovies() {
        var Data = null;
        $.ajax({
                url:'http://localhost:8080/getStreamingMovies',
                type:"get",
                dataType:"json",
                success : function() {},
            }

        )
    }
/script>

<div class="leftside">
        <div class="hot">
            <div class="subtitle">
                <h2>精選電影推薦(8部)</h2>
                <a href="#">全部&gt;</a>
            </div>
            <div class="movies">
                <style onload="getStreamingMovies()"></style>
                <c:forEach items="${sessionScope.userStreamingRecommend}" var="item">
                    <a href="#" class="first">
                        <img src="${item.image_path.concat('poster.jpg')}" alt="movies" height="220" width="160" >
                        <!-- 后續(xù)添加寬高限制 -->
                        <div>${item.title}:${item.vote_average}</div>
                    </a>
                </c:forEach>
            </div>
        </div>

    </div>

2.將Ajax請求去響應(yīng)Rest層的getStreamingMovies

   //調(diào)用業(yè)務(wù)處理層的方法獲取實(shí)時推薦的電影信息
    @RequestMapping("/getStreamingMovies")
    public void getRealTimeMovies(HttpServletRequest request, HttpServletResponse response) throws IOException {
        response.getWriter().append("Served at: ").append(request.getContextPath());

        request.setCharacterEncoding("utf-8");
        response.setCharacterEncoding("utf-8");
        response.setContentType("text/html; charset=UTF-8");
        HttpSession session = request.getSession();
        PrintWriter out = response.getWriter();

        UserService userService = new UserService();
        RecommendService recommendService = new RecommendService();
        MoviesService moviesService = new MoviesService();
        String username =(String) session.getAttribute("username");
//        String username="kurumi";
        String userIdAndGenres = userService.getUserIdByUsername(username);
        String[] user = userIdAndGenres.split(":");
        ArrayList<Recommendation> streamingRecommendation = recommendService.getStreamingRecommendation(
                new GetMovieRequest(Integer.parseInt(user[0]), Constant.STREAMING_RECOMMEND_NUM));
        //當(dāng)前沒有實(shí)施推薦的項(xiàng)目
        if (streamingRecommendation==null) {
            streamingRecommendation = recommendService.getGenresTop(new GetTopMovieGenresRequest(user[1],Constant.STREAMING_RECOMMEND_NUM));
        }
        //根據(jù)電影id獲取詳細(xì)的電影詳細(xì)
        ArrayList<Movie> moviesList = moviesService.getMoviesList(streamingRecommendation);
        ArrayList<Movie> recommendList = InfoParse.movieImageParse(moviesList);


        session.setAttribute("userStreamingRecommend",recommendList);

    }

3.jsp頁面通過foreach標(biāo)簽庫獲得對應(yīng)的值

<style onload="getStreamingMovies()"></style>
                <c:forEach items="${sessionScope.userStreamingRecommend}" var="item">
                    <a href="#" class="first">
                        <img src="${item.image_path.concat('poster.jpg')}" alt="movies" height="220" width="160" >
                        <!-- 后續(xù)添加寬高限制 -->
                        <div>${item.title}:${item.vote_average}</div>
                    </a>
                </c:forEach>

附上 jsp代碼 只完成了部分功能

<%@ page import="org.cuit.serviceProcess.model.recommand.Recommendation" %>
<%@ page import="java.util.ArrayList" %>
<%@ page import="org.cuit.serviceProcess.model.info.Movie" %>
<!DOCTYPE html>
<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page isELIgnored="false"%>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首頁</title>
    <script src="../layui/jquery.min.js"></script>
    <link rel="stylesheet" href="../css/indexstyle.css">
    <script src="../layui/layui.js" charset="utf-8"></script>
    <link rel="stylesheet" href="../layui/css/layui.css">
</head>

<body>
<!-- 導(dǎo)航欄 -->
<div class="nav">
    <div class="typeArea">
        <img src="images/logo.png" alt="logo" class="logo">
        <ul>
            <li class="selected"><a href="#">首頁</a></li>
            <li><a href="#">電影</a></li>
            <li><a href="#">影院</a></li>
            <li><a href="#">演出</a></li>
            <li><a href="#">榜單</a></li>
            <li><a href="#">熱點(diǎn)</a></li>
            <li><a href="#">商城</a></li>
        </ul>
        <div class="app">
            <div class="down"> ?APP下載</div>
            <div class="triangle"></div>
        </div>
        <div class="searchBox">
            <input type="text" name="search" id="search" placeholder="電影搜索">
            <button>?</button>
        </div>
        <div class="user">
            <img src="images/headPhoto.png" alt="headPhoto">
            <div class="triangle"></div>
        </div>
    </div>
</div>

<script >
    function getStreamingMovies() {
        var Data = null;
        $.ajax({
                url:'http://localhost:8080/getStreamingMovies',
                type:"get",
                dataType:"json",
                success : function() {},
            }

        )
    }

    function load2() {
        var Data = null;
        $.ajax({
                url:'http://localhost:8080/test222',
                type:"get",
                dataType:"json",
                success : function() {},
            }

        )
    }

</script>

<%
//獲取用戶名
    String username = (String)session.getAttribute("username");
    session.setAttribute("username",username);

//實(shí)時推薦
//    ArrayList<Movie> streamingRecommend = (ArrayList<Movie>) session.getAttribute("userStreamingRecommend");
//
////    for (Movie movie : streamingRecommend) {
////        System.out.println(movie);
////    }
//    request.setAttribute("streamingRecommend",streamingRecommend);

%>

<%--<script>--%>
<%--    layui.use(['rate'], function(){--%>
<%--        var rate = layui.rate;--%>
<%--        rate.render({--%>
<%--            elem: '#test1'--%>
<%--            ,value: 2.5--%>
<%--            //是否可以選擇半星--%>
<%--            ,half: true--%>
<%--            ,theme: '#FE0000'--%>
<%--        })--%>
<%--    });--%>
<%--</script>--%>

<!-- 導(dǎo)航欄結(jié)束 -->
<!-- 網(wǎng)頁主體 -->
<div class="webmain">
    <!-- 左側(cè) -->
    <div class="leftside">
        <div class="hot">
            <div class="subtitle">
                <h2 >你可能感興趣的(8部)</h2>
                <a href="#">全部&gt;</a>
            </div>
            <div class="movies">
                <style onload="getStreamingMovies()"></style>
                <c:forEach items="${sessionScope.userStreamingRecommend}" var="item">
                    <a href="#" class="first">
                        <img src="${item.image_path.concat('poster.jpg')}" alt="movies" height="220" width="160" >
                        <!-- 后續(xù)添加寬高限制 -->
                        <div>${item.title}:${item.vote_average}</div>
                    </a>
                </c:forEach>
            </div>


        </div>

    </div>

    <div class="leftside">
        <div class="hot">
            <div class="subtitle">
                <h2>精選電影推薦(8部)</h2>
                <a href="#">全部&gt;</a>
            </div>
            <div class="movies">
                <style onload="getStreamingMovies()"></style>
                <c:forEach items="${sessionScope.userStreamingRecommend}" var="item">
                    <a href="#" class="first">
                        <img src="${item.image_path.concat('poster.jpg')}" alt="movies" height="220" width="160" >
                        <!-- 后續(xù)添加寬高限制 -->
                        <div>${item.title}:${item.vote_average}</div>
                    </a>
                </c:forEach>
            </div>
        </div>

    </div>

    <div class="leftside">
        <div class="hot">
            <div class="subtitle">
                <h2>最近上映的(12部)</h2>
                <a href="#">全部&gt;</a>
            </div>
            <div class="movies">
                <a href="#" class="first">
                    <img src="images/mov.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov2.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov3.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov4.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#" class="first">
                    <img src="images/mov5.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov6.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov7.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov8.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
            </div>
        </div>

    </div>

    <div class="leftside">
        <div class="hot">
            <div class="subtitle">
<%--        按電影評分進(jìn)行        --%>
                <h2>電影榜單(12部)</h2>
                <a href="#">全部&gt;</a>
            </div>
            <div class="movies">
                <a href="#" class="first">
                    <img src="images/mov.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov2.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov3.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov4.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#" class="first">
                    <img src="images/mov5.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov6.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov7.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
                <a href="#">
                    <img src="images/mov8.jpg" alt="movies">
                    <!-- 后續(xù)添加寬高限制 -->
                    <div>購票</div>
                </a>
            </div>
        </div>

    </div>




    <!-- 右側(cè) -->
    <div class="rightside">
        <!-- 熱門電影   評分?jǐn)?shù) -->
        <div class="todayMoney">
            <h2>熱門電影</h2>
            <div class="top1">
                <a href="#">
                    <div class="firstImg">
                        <img src="images/top.png" alt="top" class="top">
                        <img src="images/top1.jpg" alt="top1post">
                    </div>
                    <div class="firstInfo">
                        <h3>十年一品溫如言</h3>
                        <p>6666.66萬</p>
                    </div>
                </a>
            </div>
            <ul>
                <li><a href="#">
                    <div class="num top3">2</div>
                    <h3>好想愛你</h3>
                    <div class="money">5555.55萬</div>
                </a></li>
                <li><a href="#">
                    <div class="num top3">3</div>
                    <h3>不要忘記我愛你</h3>
                    <div class="money">4444.44萬</div>
                </a></li>
                <li><a href="#">
                    <div class="num">4</div>
                    <h3>長津湖</h3>
                    <div class="money">3333.33萬</div>
                </a></li>
                <li><a href="#">
                    <div class="num">5</div>
                    <h3>這個殺手</h3>
                    <div class="money">2222.22萬</div>
                </a></li>
            </ul>
            <div class="todayBigP">
                <div class="text">今日大盤</div>
                <div class="info">
                    <div class="detail">
                        <em>1.35</em>
                        <p>億</p>
                        <a href="#">查看更多&gt;</a>
                    </div>
                    <div class="time">北京時間 09:09:06 &nbsp;&nbsp;&nbsp;貓眼專業(yè)版實(shí)時票房數(shù)據(jù)</div>
                </div>
            </div>
        </div>
        <!-- 今日票房板塊結(jié)束 -->


        <!-- 今日票房板塊 -->
        <div class="todayMoney">
            <h2>今日票房</h2>
            <div class="top1">
                <a href="#">
                    <div class="firstImg">
                        <img src="images/top.png" alt="top" class="top">
                        <img src="images/top1.jpg" alt="top1post">
                    </div>
                    <div class="firstInfo">
                        <h3>十年一品溫如言</h3>
                        <p>6666.66萬</p>
                    </div>
                </a>
            </div>
            <ul>
                <li><a href="#">
                    <div class="num top3">2</div>
                    <h3>好想愛你</h3>
                    <div class="money">5555.55萬</div>
                </a></li>
                <li><a href="#">
                    <div class="num top3">3</div>
                    <h3>不要忘記我愛你</h3>
                    <div class="money">4444.44萬</div>
                </a></li>
                <li><a href="#">
                    <div class="num">4</div>
                    <h3>長津湖</h3>
                    <div class="money">3333.33萬</div>
                </a></li>
                <li><a href="#">
                    <div class="num">5</div>
                    <h3>這個殺手</h3>
                    <div class="money">2222.22萬</div>
                </a></li>
            </ul>
            <div class="todayBigP">
                <div class="text">今日大盤</div>
                <div class="info">
                    <div class="detail">
                        <em>1.35</em>
                        <p>億</p>
                        <a href="#">查看更多&gt;</a>
                    </div>
                    <div class="time">北京時間 09:09:06 &nbsp;&nbsp;&nbsp;貓眼專業(yè)版實(shí)時票房數(shù)據(jù)</div>
                </div>
            </div>
        </div>
        <!-- 今日票房板塊結(jié)束 -->


    </div>




</div>
<%--<!-- 網(wǎng)頁底部欄 -->--%>
<%--<div class="foot">--%>
<%--    <div class="text">--%>
<%--        <div class="redLink">--%>
<%--            <h3>關(guān)于貓眼:</h3>--%>
<%--            <a href="">關(guān)于我們</a>|--%>
<%--            <a href="">管理團(tuán)隊(duì)</a>|--%>
<%--            <a href="">投資者關(guān)系</a>--%>
<%--            <h3>友情鏈接:</h3>--%>
<%--            <a href="">美團(tuán)網(wǎng)</a>|--%>
<%--            <a href="">格瓦拉</a>|--%>
<%--            <a href="">美團(tuán)下載</a>|--%>
<%--            <a href="">歡喜首映</a>--%>
<%--        </div>--%>

<%--        <p>--%>
<%--            用戶舉報/涉未成年人有害信息舉報郵箱:tousujubao@meituan.com 舞弊線索舉報郵箱:wubijubao@maoyan.com--%>
<%--        </p>--%>
<%--        <p>--%>
<%--            中華人民共和國增值電信業(yè)務(wù)經(jīng)營許可證 京B2-20190350 | 營業(yè)性演出許可證 京演(機(jī)構(gòu))(2019)4094號--%>
<%--        </p>--%>

<%--        <p>廣播電視節(jié)目制作經(jīng)營許可證 (京)字第08478號 | 網(wǎng)絡(luò)文化經(jīng)營許可證 京網(wǎng)文(2019)3837-369號</p>--%>

<%--        <p>--%>
<%--            貓眼用戶服務(wù)協(xié)議 | 貓眼平臺交易規(guī)則總則 | 隱私政策--%>
<%--        </p>--%>

<%--        <p>--%>
<%--            京公網(wǎng)安備 11010102003232號 | 京ICP備16022489號-1--%>
<%--        </p>--%>
<%--        <p>--%>
<%--            北京貓眼文化傳媒有限公司--%>
<%--        </p>--%>
<%--        <p>--%>
<%--            ?2022 貓眼電影 www.maoyan.com--%>
<%--        </p>--%>
<%--        <a href=""><img src="images/foot1.png" alt=""></a>--%>
<%--        <a href=""><img src="images/foot2.png" alt=""></a>--%>
<%--        <a href=""><img src="images/foot3.png" alt=""></a>--%>
<%--    </div>--%>
<%--</div>--%>
</body>

</html>

movies類

package org.cuit.serviceProcess.model.info;

/**
 * @version 1.0
 * @Author 高拴梁
 * @Date 2022/3/18 18:57
 * @注釋   電影類
 */
public class Movie {

    /**
     *
     * @param adult                成人
     * @param budget               預(yù)算
     * @param genres               流派
     * @param homepage             主頁
     * @param m_id                 編碼
     * @param Imdb_id              imdb編碼
     * @param original_language    初始語言
     * @param overview             概述
     * @param popularity           聲望
     * @param production_companies 發(fā)行公司
     * @param release_date         發(fā)布時間
     * @param revenue              收入
     * @param runtime              運(yùn)行
     * @param spoken_languages     語言
     * @param tagline              標(biāo)題
     * @param title                題目
     * @param vote_average         平均投票
     * @param vote_count           投票數(shù)
     */

    private String adult;
    private float budget;
    private String genres;
    private String homepage;
    private int m_id;
    private String Imdb_id;
    private String original_language;
    private String overview;
    private String popularity;
    private String production_companies;
    private String release_date;
    private float revenue;
    private float runtime;
    private String spoken_languages;
    private String tagline;
    private String title;
    private float vote_average;
    private float vote_count;
    private String image_path;

    @Override
    public String toString() {
        return "Movie{" +
                "adult='" + adult + '\'' +
                ", budget=" + budget +
                ", genres='" + genres + '\'' +
                ", homepage='" + homepage + '\'' +
                ", m_id=" + m_id +
                ", Imdb_id='" + Imdb_id + '\'' +
                ", original_language='" + original_language + '\'' +
                ", overview='" + overview + '\'' +
                ", popularity='" + popularity + '\'' +
                ", production_companies='" + production_companies + '\'' +
                ", release_date='" + release_date + '\'' +
                ", revenue=" + revenue +
                ", runtime=" + runtime +
                ", spoken_languages='" + spoken_languages + '\'' +
                ", tagline='" + tagline + '\'' +
                ", title='" + title + '\'' +
                ", vote_average=" + vote_average +
                ", vote_count=" + vote_count +
                ", imagePath=" + image_path +
                '}';
    }

    public String getImage_path() {
        return image_path;
    }

    public void setImage_path(String image_path) {
        this.image_path = image_path;
    }

    public Movie(String adult, float budget, String genres, String homepage, int m_id, String imdb_id, String original_language, String overview, String popularity, String production_companies, String release_date, float revenue, float runtime, String spoken_languages, String tagline, String title, float vote_average, float vote_count, String image_path) {
        this.adult = adult;
        this.budget = budget;
        this.genres = genres;
        this.homepage = homepage;
        this.m_id = m_id;
        Imdb_id = imdb_id;
        this.original_language = original_language;
        this.overview = overview;
        this.popularity = popularity;
        this.production_companies = production_companies;
        this.release_date = release_date;
        this.revenue = revenue;
        this.runtime = runtime;
        this.spoken_languages = spoken_languages;
        this.tagline = tagline;
        this.title = title;
        this.vote_average = vote_average;
        this.vote_count = vote_count;
        this.image_path = image_path;
    }

    public String getAdult() {
        return adult;
    }

    public void setAdult(String adult) {
        this.adult = adult;
    }

    public float getBudget() {
        return budget;
    }

    public void setBudget(float budget) {
        this.budget = budget;
    }

    public String getGenres() {
        return genres;
    }

    public void setGenres(String genres) {
        this.genres = genres;
    }

    public String getHomepage() {
        return homepage;
    }

    public void setHomepage(String homepage) {
        this.homepage = homepage;
    }

    public int getM_id() {
        return m_id;
    }

    public void setM_id(int m_id) {
        this.m_id = m_id;
    }

    public String getImdb_id() {
        return Imdb_id;
    }

    public void setImdb_id(String imdb_id) {
        Imdb_id = imdb_id;
    }

    public String getOriginal_language() {
        return original_language;
    }

    public void setOriginal_language(String original_language) {
        this.original_language = original_language;
    }

    public String getOverview() {
        return overview;
    }

    public void setOverview(String overview) {
        this.overview = overview;
    }

    public String getPopularity() {
        return popularity;
    }

    public void setPopularity(String popularity) {
        this.popularity = popularity;
    }

    public String getProduction_companies() {
        return production_companies;
    }

    public void setProduction_companies(String production_companies) {
        this.production_companies = production_companies;
    }

    public String getRelease_date() {
        return release_date;
    }

    public void setRelease_date(String release_date) {
        this.release_date = release_date;
    }

    public float getRevenue() {
        return revenue;
    }

    public void setRevenue(float revenue) {
        this.revenue = revenue;
    }

    public float getRuntime() {
        return runtime;
    }

    public void setRuntime(float runtime) {
        this.runtime = runtime;
    }

    public String getSpoken_languages() {
        return spoken_languages;
    }

    public void setSpoken_languages(String spoken_languages) {
        this.spoken_languages = spoken_languages;
    }

    public String getTagline() {
        return tagline;
    }

    public void setTagline(String tagline) {
        this.tagline = tagline;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public float getVote_average() {
        return vote_average;
    }

    public void setVote_average(float vote_average) {
        this.vote_average = vote_average;
    }

    public float getVote_count() {
        return vote_count;
    }

    public void setVote_count(float vote_count) {
        this.vote_count = vote_count;
    }
}


?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容