基于Java Web的旅游信息網(wǎng)站

摘要本次開發(fā)的網(wǎng)站是基于JSP/Servlet的WEB旅游應(yīng)用網(wǎng)站，該網(wǎng)站是以互聯(lián)網(wǎng)傳播為媒介來實現(xiàn)旅游信息發(fā)布、共享的平臺網(wǎng)站。本次論文主要論述的是的網(wǎng)站整個開發(fā)和設(shè)計的過程。在開發(fā)過程中，我們主要運用了java程序設(shè)計語言、數(shù)據(jù)庫MySQL、Redis緩存思想、ajax、json等相關(guān)知識技術(shù)。根據(jù)java面向?qū)ο箝_發(fā)的原理，采用了基于B/S結(jié)構(gòu)的開發(fā)模式和MVC軟件架構(gòu)模式的系統(tǒng)。靈活地利用了互聯(lián)網(wǎng)的信息交換具有的及時性、傳播范圍廣、不受空間限制等相關(guān)特性。該網(wǎng)站可以為熱愛旅游的麻友門提供各方各面的旅游景點信息，主要設(shè)計包含了旅游線路查詢，展示了各大旅游景點、景點圖片、商家信息、價格的信息及收藏線路功能，用戶信息管理的管理維護等這些基本模塊。通過這些模塊實現(xiàn)旅游信息數(shù)據(jù)共享，為麻友們提供及時高效、詳細準確的旅游景點信息。文中將重點對旅游網(wǎng)站的開發(fā)原理、網(wǎng)站的設(shè)計方案和功能特點的全面介紹。關(guān)鍵詞：旅游網(wǎng)站Javaweb數(shù)據(jù)庫AbstractThewebsitedevelopedthistimeisaWEBtourismapplicationwebsitebasedonJSP/Servlet.ThewebsiteisaplatformwebsitethatrealizesthepublishingandsharingoftourisminformationthroughInternetcommunication.Thispapermainlydiscussesthewholeprocessofwebsitedevelopmentanddesign.Inthedevelopmentprocess,wemainlyusedJavaprogramminglanguage,databaseMySQL,Rediscacheideas,ajax,jsonandotherrelevantknowledgeandtechnology.AccordingtotheprincipleofJavaobject-orienteddevelopment,thesystemadoptstheB/Sstructure-baseddevelopmentpatternandMVCsoftwarearchitecturepattern.FlexibleuseoftheInternetinformationexchangehastimeliness,widerangeofdissemination,freeofspacerestrictionsandotherrelatedcharacteristics.Thewebsitecanprovideallaspectsofthetouristattractioninformationfortheloveoftourismmayoumen,themaindesignincludesthetouristrouteinquiry,showingthemajortouristattractions,scenicpictures,businessinformation,priceinformationandcollectionlinefunction,userinformationmanagementmanagementandmaintenanceofthesebasicmodules.Throughthesemodules,thesharingoftourisminformationdatacanberealized,soastoprovidetimely,efficient,detailedandaccurateinformationoftouristattractionsformayou.Thispaperwillfocusonthetourismwebsitedevelopmentprinciple,websitedesignandfunctionalfeaturesofthecomprehensiveintroduction.Keywords:TourismwebsiteJavawebdatabase目錄第一章緒論 第一章緒論1.1系統(tǒng)開發(fā)的背景世界旅游行業(yè)蓬勃地發(fā)展，我國的旅游產(chǎn)物走出了國門。與此同時隨著國內(nèi)互聯(lián)網(wǎng)的大眾化和計算機網(wǎng)絡(luò)技術(shù)的與日俱進，我們步入了人人都離不開互聯(lián)網(wǎng)的時代。層出不窮的企業(yè)利用了互聯(lián)網(wǎng)技術(shù)不斷發(fā)展進步和通過互聯(lián)網(wǎng)對外宣傳自己企業(yè)的特色?；ヂ?lián)網(wǎng)為信息有需求的百姓們提供了便捷的服務(wù)。人們開始利用閑錢去旅游，旅游漸漸的也成為人們消費的熱點?；ヂ?lián)網(wǎng)旅游也是個熱點主題，所以開發(fā)者們紛紛開發(fā)設(shè)計出很多優(yōu)秀的旅游網(wǎng)站。旅游業(yè)成為各地當(dāng)作本地經(jīng)濟發(fā)展的重要支柱之一，各旅游勝地和旅行社利用旅游網(wǎng)站對外宣傳。不過許多旅游網(wǎng)站還只僅限于簡簡單單地對旅游信息的發(fā)布和介紹，而互聯(lián)網(wǎng)旅游業(yè)的發(fā)展根本不應(yīng)只是局限于此。通過瀏覽器看到的靜態(tài)頁面是得不到用戶滿足的，用戶更希望能根據(jù)自己的喜好生成更加豐富的、靈活的動態(tài)頁面。動態(tài)旅游網(wǎng)站是以數(shù)據(jù)庫技術(shù)為基礎(chǔ)的；開發(fā)者采用動態(tài)網(wǎng)頁技術(shù)可以實現(xiàn)更多模塊功能，例如用戶和管理員注冊登錄、郵箱/手機激活，通過搜索框搜索線路、后臺管理等功能。旅游網(wǎng)不是僅僅獨立存在于服務(wù)器的網(wǎng)頁文件，當(dāng)用戶請求服務(wù)器時，我們通過發(fā)送請求，回響數(shù)據(jù)。顯示一個完整的信息頁面出來。利用它來傳遞和發(fā)送數(shù)據(jù)信息，更好的展現(xiàn)頁面。1.2系統(tǒng)開發(fā)的目的與意義此次開發(fā)的主要目的是提高熱愛旅游的人們對各個旅游景點認知，對于熱愛旅游的麻游們而言，一些相關(guān)旅游信息共享是十分重要的。比如網(wǎng)上價格，圖片，收藏次數(shù)、景區(qū)景點位置、經(jīng)營商家、聯(lián)系方式等信息，為了吸收更多的旅游者前來參觀旅游，有效的開發(fā)推廣各地的旅游資源，給熱愛旅游的麻友們和各大旅游企業(yè)相關(guān)的部門提供全面詳細的旅游信息。根據(jù)改革開放以來，中國旅游地區(qū)不斷地擴大和國際旅客不斷的增長，中國目前的旅游行業(yè)越來約多樣化?？萍嫉倪M步讓旅游行業(yè)的成長空間得到了更好的提升，在未來的20年間，相信旅游不再是高消費的活動產(chǎn)品，而是作為日常生活的方式進入了家家戶戶。人們不再單純地“觀山看水”，而是更多地滿足自己的求知欲和生活體驗。1.3系統(tǒng)在國內(nèi)外發(fā)展的概況中國旅游業(yè)的發(fā)展日新月異，具有很大的潛力，中國的旅游市場逐漸引起全球的矚目。不斷地涌入外來流量，世界旅游區(qū)域的重心正向東方轉(zhuǎn)移。中國在旅游行業(yè)向外不斷地推廣，越來越多的外國朋友紛紛來到了中國。根據(jù)世界旅游組織統(tǒng)計顯示，2010年中國超過西班牙成為位居法國、美國之后的當(dāng)今全球第三大旅游目的地。從數(shù)據(jù)來看，我國旅游市場出入境游客數(shù)量分布不均勻，為不讓入境旅游市場不處于低迷狀態(tài)，利用互聯(lián)網(wǎng)推廣國內(nèi)景點，可以加快國內(nèi)旅游行業(yè)的發(fā)展。隨著旅客精神文化的需求不斷的上升，旅游是使用閑暇時間的最佳選擇之一。旅游業(yè)是一個跨國性的行業(yè)，即使我國的旅游行業(yè)在國際貿(mào)易上“量”達到了“旅游大國”的水平，但在“質(zhì)”方面，跟世界其他典型的旅游強國相比而言還是存在著很大的差距的，必須重視國內(nèi)的旅游發(fā)展。引進互聯(lián)網(wǎng)的高端技術(shù)，可以大大的提升我國旅游業(yè)的發(fā)展水平。

從2018年到2019年的中國旅游業(yè)現(xiàn)狀來看，旅游業(yè)正迎來黃金的發(fā)展期。市場的不斷擴大，目前低端的旅游產(chǎn)品供給已經(jīng)沒辦法滿足人們高品質(zhì)的需求。第二章可行性分析2.1社會可行性分析旅游行業(yè)在當(dāng)今是個高消費的行業(yè)，推動著社會的進步和發(fā)展，我國的旅游行業(yè)發(fā)展對比國際起步較晚，在改革開放后，國民經(jīng)濟得到了發(fā)展，旅游行業(yè)漸漸成為人們消費熱點，同時互聯(lián)網(wǎng)的新興，讓旅游信息網(wǎng)站日益不可或缺。本次開發(fā)網(wǎng)站主要是以世界知名旅游勝地進行了宣傳，網(wǎng)絡(luò)旅游將推動各地國民經(jīng)濟的迅速發(fā)在，將為旅游業(yè)界帶來新的生機，所以互聯(lián)網(wǎng)旅游行業(yè)在社會是可行性的，無疑可以帶動社會的發(fā)展。2.2技術(shù)可行性分析單一的網(wǎng)絡(luò)瀏覽模式造成很大的不變，所以這次的開發(fā)主要包括后臺數(shù)據(jù)庫的連接和前臺頁面與后臺進行異步的交互形式來展示頁面兩大方面，后臺數(shù)據(jù)庫需要在MYSQL數(shù)據(jù)庫建立，它讓數(shù)據(jù)保持了一致性和完整性、數(shù)據(jù)安全性好；采用了B/S結(jié)構(gòu)的開發(fā)模式和MVC軟件架構(gòu)模式，基于JavaWeb的麻游網(wǎng)，前臺頁面使用了JQuery框架技術(shù)和Ajax/Json的數(shù)據(jù)交互。數(shù)據(jù)庫Dao連接采用的是Spring的JDBC的方式和Redis（key-value存儲系統(tǒng)）緩存思想，完成數(shù)據(jù)的增刪查改等功能。工具采用了IntelliJIDEA，這款工具為編程人員具備得心應(yīng)手的集成開發(fā)環(huán)境。運用JSP+Servlet+MySQL開發(fā)靈活且便捷，維護也較為容易，所以在技術(shù)可行性上來說是可行的。2.3操作可行性分析 該網(wǎng)站是以認為主導(dǎo)，頁面簡潔，用法簡單，操作容易。適合人群：只要具有普通上網(wǎng)能力的人都可以對網(wǎng)站進行使用和操作，用戶打開網(wǎng)站可以根據(jù)自己的需求對它進行操作，它提供服務(wù)的功能模塊齊全。用戶只要打開頁面就可根據(jù)自己的需要按系統(tǒng)給出的提示信息步驟進行操作。此次的網(wǎng)站包含多層次和多方面利用信息，基本可以滿足旅客的需求。2.4經(jīng)濟可行性分析網(wǎng)站使用的基本開發(fā)工具是IntelliJIDEA、SQLyog（數(shù)據(jù)庫軟件）、火狐/谷歌等瀏覽器都是網(wǎng)絡(luò)上都有提供的軟件，有些是要收費的。系統(tǒng)投入使用后，只需要操作者通過瀏覽器瀏覽頁面和SQLyog進行操作：對網(wǎng)站信息和數(shù)據(jù)更新、修改、刪除就可完成對網(wǎng)站的系統(tǒng)維護和管理。對網(wǎng)站進行相應(yīng)的推廣和宣傳，提高網(wǎng)站的知名度，使越來越多的人在互聯(lián)網(wǎng)上更加容易的通過搜索引擎來搜索到這個旅游網(wǎng)站，這樣將會給商家?guī)砹⒏鸵娪暗男Ч?，并且很大程度上的提升旅游社的業(yè)務(wù)量，使旅游社獲得更豐富的利潤。2.5系統(tǒng)的技術(shù)介紹(1)JavaScriptJavaScript是根據(jù)面向?qū)ο蟮墓δ軐Τ绦蛟O(shè)計進行更直白、可重復(fù)性進行開發(fā)。JS是一門具有獨特性和豐富性的語言，是一種腳本語言，不僅應(yīng)用于網(wǎng)頁設(shè)計還可以應(yīng)用在移動開發(fā)上。HTML用于創(chuàng)建靜態(tài)頁面，而JS可使網(wǎng)頁變?yōu)閯討B(tài)頁面。麻游網(wǎng)通過JavaScript技術(shù)達到一些頁面動態(tài)效果，麻游網(wǎng)上在用戶注冊登錄模塊，通過JavaScript對其進行前期的驗證工作，不用跳到后臺去校驗，這大大地節(jié)約系統(tǒng)反應(yīng)時間，增強用戶的體驗感。此外，它的核心組件還覆蓋了許多可以構(gòu)建客戶端的常用組件，這讓我們在開發(fā)過程中可以利用。(2)MySQLMySQL是Oracle公司旗下的一個關(guān)系型數(shù)據(jù)庫管理系統(tǒng)。它的用法簡單，操作容易而且性能高、成本低，現(xiàn)在很多中小型公司仍然在用它。隨著它的不斷完善成熟，漸漸地也開始對大規(guī)模的網(wǎng)站或應(yīng)用的開發(fā)。對比其他數(shù)據(jù)庫，它在開發(fā)、部署和管理方面降低風(fēng)險、成本和減少復(fù)雜性。(3)jQueryjQuery是一個JavaScript庫，它具有獨特的語法，在開發(fā)過程中可以減少很多JS的代碼。要運行它需要的條件非常簡單，一臺運行現(xiàn)代瀏覽器的設(shè)備即可，對瀏覽器的要求也很自由，當(dāng)前大多數(shù)瀏覽器都支持它。在此次開發(fā)過程中，利用AJAX異步的請求，靈活地可以刷新網(wǎng)頁，它為頁面提供了動態(tài)的效果。它在處理事件中，消除了各種瀏覽器的兼容性問題。 (4)RedisRedis是Key-value的非關(guān)系型數(shù)據(jù)庫，它的存儲類型包括list(鏈表)、string(字符串)、、zset(sortedset--有序集合)set(集合)和hash（哈希類型）。它使用ANSIC語言編寫、可基于內(nèi)存亦可持久化的日志型。并且提供多種語言的API。麻游網(wǎng)采用了java的redis客戶端Jedis對其線路分類緩存進行操作。 (5)JDBCJDBC是以中可以執(zhí)行SQL語句的java接口，通過接口可以連接MYSQL數(shù)據(jù)庫，對數(shù)據(jù)庫進行增刪查改操作。在本次開發(fā)麻游網(wǎng)中，利用的是Spring的JDBCTemplate，它是SpringMVC內(nèi)置的對JDBC的一種封裝，它的使用簡單并且提供了一些靜態(tài)方法。(6)MVC MVC是麻游網(wǎng)開發(fā)中一種通常用于開發(fā)用戶界面的體系結(jié)構(gòu)模式，它將麻游網(wǎng)劃分為模型、視圖和控制器三個組成部分，M代表業(yè)務(wù)模型，V代表用戶界面，C代表控制器。利用這種模式可以將信息的內(nèi)部情況呈現(xiàn)給用戶，大大改進了用戶的交互。這個模式將復(fù)雜度簡化了，讓麻游網(wǎng)變得更加直觀。MVC設(shè)計模式利用組件分離，從而實現(xiàn)高效的代碼重用和并行開發(fā)。2.6系統(tǒng)開發(fā)平臺工具及運行環(huán)境系統(tǒng)開發(fā)平臺工具麻游網(wǎng)的開發(fā)是在Apache旗下的核心項目Tomcat上運行的。Tomcat服務(wù)器是用Java語言進行編寫的，所以運行環(huán)境需要JDK支持。此次開發(fā)的麻游網(wǎng)使用的是JDK1.9版本。IntelliJIDEA可以使開發(fā)人員利用Tomcat能夠快速部署Web程序，此次項目在開發(fā)過程中使用IntelliJIDEA2018.1.6x64作為開發(fā)工具。它是Servlet和JSP的容器。運行環(huán)境 運行操作系統(tǒng)：Windows10 所需JDK版本：1.9用戶瀏覽器：谷歌、火狐瀏覽器、IE、搜狗瀏覽器等。 服務(wù)器軟件：Tomcat7.0第三章需求分析3.1系統(tǒng)功能概況麻游網(wǎng)旨在為游客及時準確、完整發(fā)布游客所需要的相關(guān)旅游信息，同時也給旅游公司創(chuàng)造利益，它主要有如下相應(yīng)的幾個功能：登陸頁面：通過登陸進入旅游信息網(wǎng)進行瀏覽，并根據(jù)登陸者身份進入用戶或管理員頁面。注冊頁面：注冊用戶，在注冊過程中用戶通過郵箱和驗證碼進行注冊，需要將用戶信息填寫正確，并通過郵箱進行激活。主頁頁面：介紹該旅游網(wǎng)站各個旅游線路，并提供登陸和注冊和退出的方式。游客頁面：主要羅列出各個線路的展示，其中有全球自由行、國內(nèi)游、出境游、抱團定制、港澳游、酒店、門票、香港車票。主要功能有分頁展示全部的旅游信息、根據(jù)自己的要求在搜索框?qū)懭胱约合胍私獾穆糜涡畔⒈憧刹樵兊皆撔畔⑺w的各項旅游景點展示。通過列表展示的各個景點可以選擇查看詳情。用戶頁面：主要羅列出各個線路的展示，其中有全球自由行、國內(nèi)游、出境游、抱團定制、港澳游、酒店、門票、香港車票。主要功能有分頁展示全部的旅游信息、根據(jù)自己的要求在搜索框?qū)懭胱约合胍私獾穆糜涡畔⒈憧刹樵兊皆撔畔⑺w的各項旅游景點展示。通過列表展示的各個景點可以選擇查看詳情。并且可以點擊收藏，在我的收藏可以隨時查看自己收藏的記錄信息。管理員頁面：對用戶進行分頁查看和對用戶的信息進行條件查詢和修改、刪除功能，對用戶進行一個宏觀方面的關(guān)注。3.2系統(tǒng)架構(gòu)分析 該旅游信息網(wǎng)分為游客端，用戶端與管理員端三個端口，用戶模塊主要是面向全體用戶，即游客端和用戶端歸屬于用戶模塊，它提供相應(yīng)的視圖與窗口；管理模塊主要用于查看用戶各個數(shù)據(jù)，即接受用戶模塊的信息數(shù)據(jù)，并接受其處理結(jié)果。本網(wǎng)站的系統(tǒng)架構(gòu)如圖3.1所示：圖3.1系統(tǒng)架構(gòu)圖3.3系統(tǒng)功能模塊設(shè)計 根據(jù)該麻游網(wǎng)功能模塊的分析，采用了ProcessOn對功能模塊進行繪畫。 游客端模塊圖與用戶端模塊圖如圖3.2和3.3所示：圖3.2游客端功能模塊圖圖3.3用戶端功能模塊圖管理員端模塊圖如圖3.4所示：圖3.4管理員端功能模塊圖3.4系統(tǒng)用例分析 麻游網(wǎng)的劃分為游客，用戶和后臺管理員三個角色。在本次開發(fā)中三者由于角色不同，權(quán)限也不同。游客端的主要功能有分類數(shù)據(jù)展示、線路分頁展示，旅游線路條件查詢，針對每一個線路，可以點擊查看詳情。用戶端的主要功能模塊有：用戶登錄、注冊、退出登錄、郵箱激活、我的收藏、分類數(shù)據(jù)展示、線路分頁展示、旅游線路條件查詢，針對每一個線路，可以點擊查看詳情。可以點擊收藏按鈕，點擊我的收藏可以隨時查看收藏的線路信息并且分頁地展示出來。管理員端主要功能有：對用戶進行信息管理。系統(tǒng)的總體用例圖如圖3.5，圖3.6，圖3.7所示：圖3.5游客端用戶用例圖圖3.6用戶端用例圖圖3.7管理員端用用例圖

第四章數(shù)據(jù)庫的設(shè)計數(shù)據(jù)庫是麻游網(wǎng)開發(fā)中不可或缺的一部分。本次利用了MySQL這種輕量的關(guān)系行數(shù)據(jù)庫。MySQL是當(dāng)前最流行的數(shù)據(jù)庫之一，它在本次開發(fā)過程中，有利于減少開發(fā)成本，它適用于小型網(wǎng)站開發(fā)，所以我們選擇了MySQL數(shù)據(jù)庫。4.1概念模型設(shè)計概念模型是對網(wǎng)站中的對象描述，每個概念模型都是相對獨立的，這是用來幫助人們了解，理解，或模擬對象的模型表示。在開發(fā)過程中，實體關(guān)系模型（ERM）是數(shù)據(jù)的抽象和概念表示。實體關(guān)系建模是用于生成一種系統(tǒng)數(shù)據(jù)庫建模的方法，E-R方法是設(shè)計概念模型常用的方法之一，本次開發(fā)中的全局E-R模型，如圖4.1所示：圖4.1全局E-R模型根據(jù)設(shè)計規(guī)劃的主要實體有：管理員、用戶、旅游線路、收藏線路、線路詳情、賣家信息、線路圖片。各個實體里部分的描述屬性圖如下：用戶實體如圖4.2所示圖4.2用戶實體圖 旅游線路實體如圖4.3所示：圖4.3旅游線路實體圖 管理員實體如圖4.4所示：圖4.4管理員實體圖 收藏線路實體如圖4.5所示：圖4.5收藏線路實體圖 賣家實體如圖4.6所示：圖4.6賣家實體圖 線路圖片實體如圖4.7所示：圖4.7線路圖片實體圖4.2數(shù)據(jù)庫表設(shè)計數(shù)據(jù)庫表的設(shè)計在麻游網(wǎng)開發(fā)過程中十分重要，數(shù)據(jù)庫表不僅要求儲存完整的數(shù)據(jù)模型，還不能存在數(shù)據(jù)庫復(fù)雜，數(shù)據(jù)冗余的情況。根據(jù)需求合理的設(shè)計麻游網(wǎng)各大功能所需的數(shù)據(jù)庫表，對麻游網(wǎng)各個功能和功能之間聯(lián)系的理解與掌握，確定用戶和數(shù)據(jù)庫使用的要求和各種約束條件，形成用戶需求規(guī)約。麻游網(wǎng)數(shù)據(jù)庫表如下：表4.1tab_user用戶表字段名稱數(shù)據(jù)類型主鍵是否為空說明uidIntYN主鍵usernamevarcharNN用戶名passwordvarcharNN密碼namevarcharN姓名birthdaydateN生日sexcharN性別telephonevarcharN電話emailvarcharN郵箱statuscharN激活狀態(tài)codevarcharN激活碼表4.2tab_seller賣家表字段名稱數(shù)據(jù)類型主鍵是否為空說明sidintYN主鍵snamevarcharNN賣家名consphonevarcharNN賣家電話addressvarcharN賣家地址表4.3tab_route_img線路圖片表字段名稱數(shù)據(jù)類型主鍵是否為空說明rgidintYN主鍵ridintNN線路idbigPicvarcharNN詳情商品大圖smallPicvarcharN詳情商品小圖表4.4tab_rout線路表字段名稱數(shù)據(jù)類型主鍵是否為空說明ridintYN主鍵rnamevarcharNN線路名稱pricedoubleNN價格routeIntroducevarcharN線路介紹rflagcharNN是否上架rdatevarcharN上架時間isThemeTourcharNN是否主題旅游countintN收藏數(shù)量cidintN所屬分類rimagevarcharN縮量圖sidintN所屬商家sourceIdvarcharN商品詳情圖片列表表4.5tab_favorite收藏表字段名稱數(shù)據(jù)類型主鍵是否為空說明ridintYN主鍵datedateNN收藏時間uidvarcharNN所屬用戶id表4.6tab_category線路分類表字段名稱數(shù)據(jù)類型主鍵是否為空說明cidintYN主鍵cnamevarcharNN分類名稱表4.8tab_admin管理員表字段名稱數(shù)據(jù)類型主鍵是否為空說明idintYN主鍵adminnamevarcharNN管理員名passwordvarcharNN密碼第五章前臺功能設(shè)計與實現(xiàn)麻游網(wǎng)功能模塊的設(shè)計與實現(xiàn)是按照“低耦合、高內(nèi)聚”的原則，劃分為以下幾個主要功能模塊：用戶功能模塊；線路信息瀏覽功能模塊；景點信息查詢功能模塊；線路收藏功能模塊。5.1用戶狀態(tài)圖與活動圖設(shè)計麻游網(wǎng)的用戶狀態(tài)圖主要分為注冊狀態(tài)圖和登錄狀態(tài)圖。利用ProcessOn分別畫出，如圖5.1.1、5.1.2所示。注冊狀態(tài)圖呈現(xiàn)了用戶注冊時的狀態(tài)轉(zhuǎn)換，游客首次進入麻游網(wǎng)是沒有用戶的存檔的，需要進行用戶注冊，注冊時，利用JS進行輸入格式校驗，驗證碼校驗，如果輸入的信息格式不符合驗證或者驗證碼錯誤時，則會提出錯誤信息，用戶需輸入正確格式和驗證碼方可注冊，注冊完需要登錄自己的郵箱，進行郵箱激活后方可真正的注冊成功。登錄狀態(tài)圖則呈現(xiàn)了用戶登錄時的狀態(tài)轉(zhuǎn)換，游客進入首頁時，當(dāng)你想進行點擊用戶權(quán)限的功能模塊時，游客需要進行用戶登錄，在登錄時會進行JS校驗，需輸入正確格式方可登錄成功。如果在輸入信息時有錯，則提出錯誤信息，需要重新輸入。圖5.1.1注冊狀態(tài)圖圖5.1.2登錄狀態(tài)圖用戶活動圖可以呈現(xiàn)用戶在麻游網(wǎng)中的活動狀態(tài)，從開始到結(jié)束整個過程中，需要用戶在打開網(wǎng)站之后才會進入麻游網(wǎng)主頁，主頁能查看登錄的用戶狀態(tài)、分類旅游線路列表和各線路商品列表的展示，主頁有登錄、注冊、退出、我的收藏按鈕。游客根據(jù)自己是否注冊選擇注冊或者登錄頁面。登錄過程中，系統(tǒng)會自動查詢數(shù)據(jù)庫判斷登錄者是否已有注冊激活過。如果注冊成功并且激活可以進入用戶界面，無論是哪個一位用戶，都可以查詢并收藏線路詳情中的景點；在我的收藏中可以查詢自己收藏過的線路展示，并且可以點擊查看線路詳情；如果登錄不成功，則只可以查詢線路詳情中景點，無法進行收藏，需登錄用戶狀態(tài)方可收藏。 圖5.1.3用戶活動圖5.2旅游信息網(wǎng)首頁設(shè)計首頁模塊的布局分為三個部分，分別為上、中、下，采用內(nèi)嵌框架技術(shù)。首頁如圖5.2.1所示圖5.2.1旅游信息網(wǎng)首頁圖上端部分的實現(xiàn)上部分為兩個部分的內(nèi)容，分別為：廣告欄；網(wǎng)站多個功能按鈕和線路搜索欄；導(dǎo)航欄菜單；網(wǎng)站上端部分最上面為網(wǎng)站的廣告欄，中間為管理員登錄、用戶登錄、用戶注冊、退出、我的收藏的功能按鈕；緊接著下面：左邊為該旅游信息網(wǎng)站的logo，中間是一個搜索輸入框和一個搜索按鈕，右邊是一個客服熱線；上端部分的最下面是以導(dǎo)航欄菜單里包含了一些超鏈接，有首頁、門票、酒店、香港車票、處境游、國內(nèi)游、港澳游、抱團定制、全球自由行、收藏排行版，十個按鈕，分別對應(yīng)不同的頁面。此處只對應(yīng)首頁、國內(nèi)游、收藏排行版、我的收藏頁面。中間部分的實現(xiàn)上面部分是一個宣傳位（插入輪播圖廣告）；中間一個線路精選，分別是人氣旅游、最新旅游和主題旅游；下面是一個國內(nèi)游和境外游的商品列表展示，用于宣傳。下端部分的實現(xiàn)網(wǎng)站下端部分由服務(wù)介紹組成，里面主要包含了幾個服務(wù)介紹和旅游信息網(wǎng)站聯(lián)系方式。5.3 用戶功能模塊5.3.1用戶注冊1、 用戶注冊的操作設(shè)計描述：新用戶首次訪問本站，必須注冊。點擊注冊按鈕可以跳轉(zhuǎn)到注冊頁面，在這個注冊頁面，通過JS表單驗證輸入正確格式的用戶信息，如若已有用戶賬號無需注冊，可以點擊“立即登錄“即可進入登錄頁面。注冊完，需要通過郵箱進行激活，方可注冊用戶成功。2、 用戶注冊的模塊圖：圖5.3.1用戶模塊圖3、 類的說明：1、用戶模塊歸納在User類里2、主要方法：booleanregist(Useruser);注冊用戶booleanactive(Stringcode);激活用戶3、主要算法： 獲取激活碼，判斷激活是否成功，成功后跳轉(zhuǎn)登錄頁面，失敗，聯(lián)系后臺。Stringcode=request.getParameter("code");

if(code!=null){

booleanflag=service.active(code);

Stringmsg=null;

if(flag){

msg="激活成功，請<ahref='login.html'>登錄</a>";

}else{

msg="激活失敗，請聯(lián)系管理員!";

}4、 用戶注冊的實現(xiàn)：圖5.3.2用戶注冊圖用戶在輸入用戶的注冊信息時需要進行JS表單校驗，內(nèi)容如下：用戶名校驗：單詞字符，長度8到20位；登錄密碼校驗：單詞字符，長度8到20位；Email校驗：郵箱格式；姓名校驗：Email不能為空；手機號校驗：手機號格式；出生日期校驗：出生日期不能為空；驗證碼校驗：驗證碼要與圖片碼一致。用戶注冊和激活的代碼實現(xiàn)：if(checkcode_server==null||!checkcode_server.equalsIgnoreCase(check)){

ResultInfoinfo=newResultInfo();

info.setFlag(false);

info.setErrorMsg("驗證碼錯誤");

response.setContentType("application/json;charset=utf-8");

response.getWriter().write(writeValueAsString(info));

return;

}

if(flag){

info.setFlag(true);

}else{

info.setFlag(false);

info.setErrorMsg("注冊失敗!");

}5.3.2用戶登錄1、用戶登錄的操作設(shè)計描述：用戶注冊完成之后需要登錄自己的郵箱進行郵箱激活才算注冊成功，注冊成功后會自動跳轉(zhuǎn)到登錄頁面進行用戶登錄，如果之前有用戶注冊過的存檔，可以直接在首頁點擊“登錄”鏈接來進入登錄頁面。用戶在輸入表單時不會進行校驗，提交后無此用戶、用戶名或者密碼輸入錯誤時會登錄失敗并返回登錄頁面，提示信息：用戶名或密碼錯誤，需要重新進行輸入登錄信息。2、用戶登錄的模塊圖：圖5.3.1用戶登錄圖3、類的說明：1、用戶模塊歸納在User類里2、主要方法：Userlogin(Useruser);登錄用戶3、主要算法： 判斷用戶是否存在，用戶存在判斷是否已經(jīng)激活，激活了登錄成功。if(u==null){

//用戶名密碼或錯誤

info.setFlag(false);

info.setErrorMsg("用戶名密碼或錯誤");

}

//5.判斷用戶是否激活

if(u!=null&&!"Y".equals(u.getStatus())){

info.setFlag(false);

info.setErrorMsg("您尚未激活，請激活");

}

//6.判斷登錄成功

if(u!=null&&"Y".equals(u.getStatus())){

info.setFlag(true);

}4、用戶登錄的實現(xiàn)：圖5.3.2用戶登錄圖用戶在輸入表單時不會進行校驗，需要提交后在后臺進行驗證，若無此用戶、用戶名或者密碼輸入錯誤時會登錄失敗并響應(yīng)錯誤信息到登錄頁面去，提示錯誤信息：用戶名或密碼錯誤。登錄成功：用戶點擊“登錄”鏈接，輸入正確并存在用戶賬號和密碼，登錄成功后，系統(tǒng)會把用戶信息存在Session里面并且進入首頁，頁面中用戶姓名有提示信息的功能。用戶在登錄成功之后，可以點擊“我的收藏”鏈接來查看自己在相關(guān)旅游線路景點上的收藏信息。也可以點擊每個收藏線路的線路詳情，點擊后跳轉(zhuǎn)到當(dāng)前點擊的這個線路詳情頁面。用戶登錄的主要代碼實現(xiàn)：if(u==null){

info.setFlag(false);

info.setErrorMsg("用戶名或密碼錯誤");

}

if(u!=null&&!"Y".equals(u.getStatus())){

info.setFlag(false);

info.setErrorMsg("您尚未激活，請激活");

}

if(u!=null&&"Y".equals(u.getStatus())){

request.getSession().setAttribute("user",u);

info.setFlag(true);

}5.3.3用戶退出1、用戶退出的操作設(shè)計描述： 登錄成功后在index頁面中有用戶姓名的提示功能，點擊頁面的退出按鈕，就返回游客頁面并且index頁面沒有用戶姓名的提示。2、用戶退出的模塊圖：圖5.3.1退出模塊圖3、類的說明：1、用戶模塊歸納在User類里2、主要方法：voidfindOne();獲取登錄用戶voidexit();退出用戶3、主要算法： 從session中獲取登錄用戶，將user寫回客戶端。點擊退出后，銷毀session，跳轉(zhuǎn)到登錄頁面。Objectuser=request.getSession().getAttribute("user");request.getSession().invalidate();response.sendRedirect(request.getContextPath()+"/login.html");4、用戶退出的實現(xiàn)：圖5.3.2用戶退出圖 當(dāng)?shù)卿洺晒螅瑂ession中有user對象，index頁面中會有用戶的提示功能。點擊退出按鈕時，訪問serlet，將session銷毀，跳轉(zhuǎn)到登錄界面 用戶退出的實現(xiàn)：Header.html$(function(){

$.get("user/findOne",{},function(data){

varmsg="歡迎回來，"+;

});<divclass="login">

<spanid="span_username"></span>

<ahref="#"class="collection"onclick="myFavorite();">我的收藏</a>

<ahref="javascript:location.href='user/exit';">退出</a>

</div>ServletObjectuser=request.getSession().getAttribute("user");

writeValue(user,response);

request.getSession().invalidate();

response.sendRedirect(request.getContextPath()+"/login.html");5.4 線路信息瀏覽功能模塊5.4.1分類數(shù)據(jù)展示1、分類數(shù)據(jù)展示的操作設(shè)計描述： 在主頁的導(dǎo)航欄菜單上，點擊了不同的分類后，將會看到的旅游線路不一樣。分類的數(shù)據(jù)在每一次頁面加載后都會進行一次請求數(shù)據(jù)庫來加載信息，所以對數(shù)據(jù)庫的壓力較大，而且分類的數(shù)據(jù)不會經(jīng)常性地產(chǎn)生變化，所以可以使用redis對分類數(shù)據(jù)進行緩存優(yōu)化。2、分類數(shù)據(jù)展示的模塊圖：圖5.4.1分類數(shù)據(jù)模塊圖3、類的說明：1、分類模塊歸納在Category類里2、主要方法：List<Category>findAll();獲取所有分類數(shù)據(jù)3、主要算法： 判斷查詢的集合是否為空，為空的話需要從數(shù)據(jù)庫查詢，并存入redis，不為空的話直接從redis中查詢。if(categorys==null||categorys.size()==0){

System.out.println("從數(shù)據(jù)庫查詢");

cs=categoryDao.findAll();

for(inti=0;i<cs.size();i++){

jedis.zadd("category",cs.get(i).getCid(),cs.get(i).getCname());

}

}else{

System.out.println("從redis中查詢");4、分類數(shù)據(jù)展示的實現(xiàn)：圖5.4.2分類數(shù)據(jù)圖打開Redis服務(wù)器后，打開頁面。使用redis的sortedset，導(dǎo)航欄分類會按存儲的順序來展示。第一次訪問會從數(shù)據(jù)庫的tab_category表查詢出所有的分類數(shù)據(jù)，并存入redis。之后打開頁面直接從redis緩存里邊查詢。 分類數(shù)據(jù)展示的主要代碼：Header.html$.get("category/findAll",{},function(data){

varlis='<liclass="nav-active"><ahref="index.html">首頁</a></li>';

for(vari=0;i<data.length;i++){

varli='<li><ahref="route_list.html?cid='+data[i].cid+'">'+data[i].cname+'</a></li>';

lis+=li;

}CategoryServiceJedisjedis=JedisUtil.getJedis();

Set<Tuple>categorys=jedis.zrangeWithScores("category",0,-1);

List<Category>cs=null;

if(categorys==null||categorys.size()==0){

cs=categoryDao.findAll();

for(inti=0;i<cs.size();i++){

jedis.zadd("category",cs.get(i).getCid(),cs.get(i).getCname());

}

}else{

cs=newArrayList<Category>();

for(Tupletuple:categorys){

Categorycategory=newCategory();

category.setCname(tuple.getElement());

category.setCid((int)tuple.getScore());

cs.add(category);}}

returncs;5.4.2線路分頁展示1、線路分頁展示的操作設(shè)計描述： 根據(jù)分頁模塊和數(shù)據(jù)庫表的分析結(jié)構(gòu)，旅游線路表tab_route和分類表tab_category是多對一的關(guān)系，由分類數(shù)據(jù)cid查詢不同的旅游線路。頁面顯示出不同的信息分類按鈕，點擊不同的分類后，在頁面下方有分頁工具條數(shù)據(jù)展示，其中有展示總頁碼、總記錄數(shù)、上一頁、下一頁、首頁、尾頁、10個頁碼的展示。2、線路分頁展示的模塊圖：圖5.4.3分頁展示模塊圖3、類的說明：1、分頁模塊歸納在PageBean類里2、主要方法：intfindTotalCount1(intcid); 根據(jù)分類數(shù)據(jù)cid查詢總記錄數(shù)List<Route>findByPage1(intcid,intstart,intpageSize);根據(jù)cid、start、 pageSize查詢當(dāng)前頁面的數(shù)據(jù)集合3、主要算法： 分頁工具條一共展示10個頁碼，能夠達到前5后4的效果，如果前面不夠5個，后邊補齊10個；如果后邊不足4個，前邊補齊10個。varbegin;//開始位置

varend;//結(jié)束位置

//1.要顯示10個頁碼

if(pb.totalPage<10){

//總頁碼不夠10頁

begin=1;

end=pb.totalPage;

}else{

//總頁碼超過10頁

begin=pb.current5;

end=pb.currentPage+4;

//2.如果前邊不夠5個，后邊補齊10個

if(begin<1){

begin=1;

end=begin+9;

}

//3.如果后邊不足4個，前邊補齊10個

if(end>pb.totalPage){

end=pb.totalPage;

begin=end-9;

}

}4、線路分頁展示的實現(xiàn)：圖5.4.4分頁效果圖當(dāng)頁面加載完成后，調(diào)用load方法，發(fā)送ajax請求加載數(shù)據(jù)，傳遞cid，currentPage給服務(wù)器端，服務(wù)器解析pagebean數(shù)據(jù)，在頁面上展示總頁碼，總記錄數(shù)，計算上一頁的頁碼，分頁頁碼（前5后4的效果），定義開始位置和結(jié)束位置，將數(shù)據(jù)庫查詢到的數(shù)據(jù)通過每頁顯示5條數(shù)據(jù)展示出來。線路分頁展示主要的代碼：前端route_list.html：functionload(cid,currentPage,rname){

$.get("route/pageQuery2",{cid:cid,currentPage:currentPage,rname:rname},function(pb){

$("#totalPage").html(pb.totalPage);

$("#totalCount").html(pb.totalCount);

varlis="";

varfristPage='<lionclick="javascipt:load('+cid+',1,\''+rname+'\')"><ahref="javascript:void(0)">首頁</a></li>';

varbeforeNum=pb.current1;

if(beforeNum<=0){

beforeNum=1;

}

varbeforePage='<lionclick="javascipt:load('+cid+','+beforeNum+',\''+rname+'\')"class="threeword"><ahref="javascript:void(0)">上一頁</a></li>';

lis+=fristPage;

lis+=beforePage;

varbegin;

varend;

if(pb.totalPage<10){

begin=1;

end=pb.totalPage;

}else{

begin=pb.current5;

end=pb.currentPage+4;

if(begin<1){

begin=1;

end=begin+9;

}

if(end>pb.totalPage){

end=pb.totalPage;

begin=end-9;

}

}

for(vari=begin;i<=end;i++){

varli;

if(pb.currentPage==i){

li='<liclass="curPage"onclick="javascipt:load('+cid+','+i+',\''+rname+'\')"><ahref="javascript:void(0)">'+i+'</a></li>';

}else{

li='<lionclick="javascipt:load('+cid+','+i+',\''+rname+'\')"><ahref="javascript:void(0)">'+i+'</a></li>';

}

lis+=li;

}

varlastPage='<liclass="threeword"onclick="javascipt:load('+cid+','+pb.totalPage+',\''+rname+'\')"><ahref="javascript:;">末頁</a></li>';

varnextNum=pb.currentPage+1;

if(nextNum>=pb.totalPage){

nextNum=pb.totalPage

}

varnextPage='<liclass="threeword"onclick="javascipt:load('+cid+','+nextNum+',\''+rname+'\')"><ahref="javascript:;">下一頁</a></li>';

lis+=nextPage;

lis+=lastPage;Servlet:intcid=0;

if(cidStr!=null&&cidStr.length()>0&&!"null".equals(cidStr)){

cid=Integer.parseInt(cidStr);

}

intcurrentPage=0;

if(currentPageStr!=null&¤tPageStr.length()>0){

currentPage=Integer.parseInt(currentPageStr);

}else{

currentPage=1;

}

intpageSize=0;

if(pageSizeStr!=null&&pageSizeStr.length()>0){

pageSize=Integer.parseInt(pageSizeStr);

}else{

pageSize=5;

}

PageBean<Route>pb=routeService.pageQuery1(cid,currentPage,pageSize);

writeValue(pb,response);

}5.4.3景點信息查詢1、景點信息查詢的操作設(shè)計描述： 在線路搜索框里輸入想要搜索的線路名稱，服務(wù)器端獲取客戶端輸入的名稱，查詢數(shù)據(jù)庫，將線路名稱里包含輸入內(nèi)容的線路分頁地在客戶端展示出來。2、景點信息查詢的模塊圖：圖5.4.5景點查詢模塊圖3、類的說明： 1、景點查詢模塊歸納在Route類。 2、主要方法：intfindTotalCount2(intcid,Stringrname); 根據(jù)分類數(shù)據(jù)cid查詢總記錄數(shù)List<Route>findByPage2(intcid,intstart,intpageSize,Stringrname);根 據(jù)cid、start、pageSize、rname查詢當(dāng)前頁面的數(shù)據(jù)集合3、主要算法： 根據(jù)輸入的線路名稱數(shù)據(jù)庫查詢對應(yīng)的線路。 select*fromtab_routewherecid=?andrnamelike?limit?,?4、景點信息查詢的實現(xiàn)：圖5.4.6景點查詢圖導(dǎo)航欄跳轉(zhuǎn)到國內(nèi)游時，可以根據(jù)給搜索欄輸入搜索的線路名稱，查詢到想要的線路，并且按分頁的方式展示出來。用戶查詢線路的主要代碼實現(xiàn)：Header.html $("#search-button").click(function(){

varrname=$("#search_input").val();

varcid=getParameter("cid");

location.href="http://localhost/travel/route_list.html?cid="+cid+"&rname="+rname;

});

});Servlet:intcid=0;

if(cidStr!=null&&cidStr.length()>0&&!"null".equals(cidStr)){

cid=Integer.parseInt(cidStr);

}

intcurrentPage=0;if(currentPageStr!=null&¤tPageStr.length()>0){

currentPage=Integer.parseInt(currentPageStr);

}else{

currentPage=1;

}

intpageSize=0;

if(pageSizeStr!=null&&pageSizeStr.length()>0){

pageSize=Integer.parseInt(pageSizeStr);

}else{

pageSize=5;

}

PageBean<Route>pb=routeService.pageQuery2(cid,currentPage,pageSize,rname);

writeValue(pb,response);

}5.5 線路詳情展示功能模塊5.5.1線路詳情展示1、線路詳情展示的操作設(shè)計描述： 點擊線路詳情，可以跳轉(zhuǎn)到線路詳情頁面。頁面有輪播圖的自動播放，幾張景點圖可以點擊切換。詳情頁面還有景點的介紹和活動、經(jīng)營商信息、價格、點擊收藏、旅客須知。2、線路詳情展示的模塊圖：圖5.5.1線路詳情模塊圖3、類的說明： 1、線路詳情模塊歸納在Route、Seller和RouteImg類。 2、主要方法：RoutefindRouteByRid(intrid); 根據(jù)線路商品的rid查詢商品信息SellerfindById(intid);根據(jù)商家id查詢運營商信息List<RouteImg>findByRid(intrid);根據(jù)route的id查詢圖片3、主要算法： 讓圖片自動輪播的方法：arcur_index=$('.prosum_leftdd').find('a.cur_img').index();cur_index=cur_index-1;varnum=$('.little_img').length;varmax_index=3;if((num-1)<3){max_index=num-1;}if(cur_index<max_index){varnext_index=cur_index+1;varbig_pic=$('.little_img:eq('+next_index+')').data('bigpic');$('.little_img').removeClass('cur_img');$('.little_img:eq('+next_index+')').addClass('cur_img');$('.big_img').attr('src',big_pic);}else{varbig_pic=$('.little_img:eq(0)').data('bigpic');$('.little_img').removeClass('cur_img');$('.little_img:eq(0)').addClass('cur_img');$('.big_img').attr('src',big_pic);}4、線路詳情展示的實現(xiàn)：圖5.5.2線路詳情頁面圖在線路列表對每個線路都可以點擊線路詳情，查詢線路信息。線路信息里面包含了圖片的切換，活動介紹、價格、商家信息、點贊功能。線路詳情展示的主要代碼實現(xiàn)：route_detail.html$(function(){

varrid=getParameter("rid");

$.get("route/findOne",{rid:rid},function(route){

$("#rname").html(route.rname);

$("#routeIntroduce").html(route.routeIntroduce);

$("#price").html("￥"+route.price);

$("#sname").html(route.seller.sname);

$("#consphone").html(route.seller.consphone);

$("#address").html(route.seller.address);

$("#favoriteCount").html("已收藏"+route.count+"次");

varddstr='<aclass="up_imgup_img_disable"></a>';

for(vari=0;i<route.routeImgList.length;i++){

varastr;

if(i>=4){

astr='<atitle=""class="little_img"data-bigpic="'+route.routeImgList[i].bigPic+'"style="display:none;">\n'+

'<imgsrc="'+route.routeImgList[i].smallPic+'">\n'+

'</a>';

}else{

astr='<atitle=""class="little_img"data-bigpic="'+route.routeImgList[i].bigPic+'">\n'+

'<imgsrc="'+route.routeImgList[i].smallPic+'">\n'+

'</a>';

}

ddstr+=astr;

}

ddstr+='<aclass="down_imgdown_img_disable"style="margin-bottom:0;"></a>';

$("#dd").html(ddstr);

goImg();

});

});ServletpublicvoidfindOne(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{

Stringrid=request.getParameter("rid");

Routeroute=routeService.findOne(rid);

writeValue(route,response);

}5.6旅游收藏功能的模塊5.6.1旅游線路收藏1、旅游線路收藏的操作設(shè)計描述： 在線路詳情頁面可以點擊收藏，假如用戶沒有登錄，需要登錄后才可以點贊。在主頁可以點擊我的收藏。跳轉(zhuǎn)到我的收藏頁面可以得到該用戶收藏過的線路列表分頁展示。2、旅游線路收藏的模塊圖：圖5.6.1線路收藏模塊圖3、類的說明： 1、線路收藏模塊歸納在Favorite類。 2、主要方法：booleanisFavorite(Stringrid,intuid); 判斷該用戶是否收藏該線路voidadd(Stringrid,intuid);用戶添加收藏線路PageBean<Favorite>myFavorite(Useruser,intcurrentPage,intpageSize);我的收藏頁面分頁展示收藏列表3、主要算法： 在詳情頁面點擊收藏按鈕，判斷當(dāng)前當(dāng)前是否為登錄用戶，再判斷當(dāng)前用戶是否收藏過該線路。//1.獲取線路id

Stringrid=request.getParameter("rid");

//2.獲取當(dāng)前登錄的用戶user

Useruser=(User)request.getSession().getAttribute("user");

intuid;//用戶id

if(user==null){

//用戶尚未登錄

uid=0;

}else{

//用戶已經(jīng)登錄

uid=user.getUid();

}

//3.調(diào)用FavoriteService查詢是否收藏

booleanflag=favoriteService.isFavorite(rid,uid);

//4.寫回客戶端

writeValue(flag,response);4、旅游線路收藏的實現(xiàn)：圖5.6.2用戶收藏過的頁面圖圖5.6.3我的收藏圖 在詳情頁面要是旅客的身份是無法收藏，點擊收藏它會跳出信息提醒你登錄用戶，點擊確認跳轉(zhuǎn)到登陸頁面，登錄完才能收藏線路。點擊我的收藏鏈接也是先用這個邏輯進行判斷。在登錄后詳情頁面如果用戶之前已經(jīng)收藏過該線路，則點擊收藏按鈕會變?yōu)榛疑瑹o法再進行點擊。按鈕旁邊會顯示多少用戶收藏過該線路。登錄用戶后點擊我的收藏，可以看到一個分頁展示線路列表的頁面。用戶收藏的主要代碼實現(xiàn)：Route_detail.html判斷用戶已經(jīng)收藏過的代碼$(function(){

varrid=getParameter("rid");

$.get("route/isFavorite",{rid:rid},function(flag){

if(flag){

$("#favorite").addClass("already");

$("#favorite").attr("disabled","disabled");

$("#favorite").removeAttr("onclick");點擊收藏按鈕觸發(fā)的方法functionaddFavorite(){

varrid=getParameter("rid");

$.get("user/findOne",{},function(user){

if(user){

$.get("route/addFavorite",{rid:rid},function(){

location.reload();

});

}else{

alert("您尚未登錄，請登錄");

location.href="http://localhost/travel/login.html";

}

})myfavorite.htmlfunctionload(currentPage){

$.get("user/myFavorite",{currentPage:currentPage},function(pageBean){

varroutes=pageBean.list;

$("#totalCount").html(pageBean.totalCount);

$("#totalPage").html(pageBean.totalPage);

varrou_str="";

for(vari=0;i<routes.length;i++){

vardiv='<divclass="col-md-3">\n'+

'<ahref="route_detail.html?rid='+routes[i].route.rid+'">\n'+

'<imgsrc="'+routes[i].route.rimage+'"alt=""></a>\n'+

'<divclass="has_border">\n'+

'<h3><aroute_detail.html?rid='+routes[i].route.rid+'">'+routes[i].route.rname+'</a></h3>\n'+

'<divclass="price">網(wǎng)付價<em>￥</em><strong>'+routes[i].route.price+'</strong><em>起</em></div>\n'+

'</div>\n'+

'</a>\n'+

'</div>';

rou_str+=div;

}

$("#route").html(rou_str);

varbeforeNum=pageBean.current1;

if(beforeNum<=0){

beforeNum=1;

}

varlis='<lionclick="javascript:load(1)"><ahref="javascript:void(0);">首頁</a></li>\n'+

'<lionclick="javascript:load('+beforeNum+')"class="threeword"><ahref="javascript:void(0);">上一頁</a></li>';

varbeginNum;

varendNum;

if(pageBean.totalPage<10){

beginNum=1;

endNum=pageBean.totalPage;

}else{

beginNum=pageBean.current5;

endNum=pageBean.currentPage+4;

if(beginNum<1){

beginNum=1;

endNum=beginNum+9;

}

if(endNum>pageBean.totalPage){

endNum=pageBean.totalPage;

beginNum=endNum-9;

}

}

for(vari=beginNum;i<=endNum;i++){

varli='<lionclick="javascript:load('+i+')"><ahref="javascript:void(0);">'+i+'</a></li>';

lis+=li;

}

varnextNum=pageBean.currentPage+1;

if(nextNum>pageBean.totalPage){

nextNum=pageBean.totalPage;

}

lis+='<lionclick="javascript:load('+nextNum+')"class="threeword"><ahref="javascript:void(0);">下一頁</a></li>\n'+

'<lionclick="javascript:load('+pageBean.totalPage+')"class="threeword"><ahref="javascript:void(0);">末頁</a></li>';

$("#pageNum").html(lis);

});Servlet Stringrid=request.getParameter("rid");

Useruser=(User)request.getSession().getAttribute("user");

intuid;

if(user==null){

uid=0;

}else{

uid=u