フロントエンドページ機能のモジュラー分割
システムに多くの機能がある場合、すべての機能モジュールが1つのページに記述されることは不可能です。この時点で、異なる機能モジュールのページをテンプレートのように分割する必要があります。機能が必要なページが呼び出され、対応するデータがロードされ、対応するページに表示されます。
このアプリケーションでは、Spring+Struts+MyBatis+JSPを使用して、2つのソリューションを使用してフロントエンドページ関数の分割を完了します。
プラン1：
JSPページでは、EL式またはJavaコードを使用して、ページデータがバックグラウンドに記入されています。次に、JSでページの切り替えを完了します。
JSPコード：
ビジネスの詳細モジュールページ：riskdetailitem.jspページコードは、EL式を使用してデータ充填を完了します。
<div> <テーブルスタイル= "font-size：14px;"> <tr> <td>カスタマー名</td> <td> $ {loanriskbean.cusname} </td> <td>ローン金額</td> <td> $ {loanriskbean.duebillamount}} yuanストラットのXMLファイルコード：
倫理映画http://www.dotdy.com/
<action name = "riskdetailitem" method = "dationalitem"> <result name = "success">/jsp/riskrecheck/riskdetailitem.jsp </result> </action>
動作中のコード：
プライベートローンリスクビーンローンリスクビーン; public String dationalItem（）{try {loanriskbean = riskrecheckserviceimpl.detailitem（riskid）; - サービスのメソッドを呼び出してデータを照会} catch（例外e）{e.printstacktrace（）; loggerutil.info（ "例外はviewの詳細で発生しました！------ detailitem（）"）;新しいruntimeexceptionを投げます（「例外は視聴ビューの詳細で発生しました！」）; }成功を返す; } public void setloanriskbean（loanriskbean loanriskbean）{this.loanriskbean = loanriskbean; } JSのコード：
$（document）。 //詳細Queryメソッドを宣言するvar relatedinfo = function（）{$ .ajax（{url：url： 'get'、datatype： 'json'、success：function（data）{}}）} relatedInfo（）; //詳細クエリメソッドLESTERTDIALOG = $ダイアログ（{ID： 'LESTORDDIALOG'、width：1000、title： "related balue"、cancelValue： 'close'、content：onshow：function（）{$（ "。arui-dialog"）。 $（「Min-Height」、「300px」）。 2番目のソリューション：
対応する機能モジュールのJSPページでは、静的コードのみであり、JSのデータ充填が必要です。ただし、対応するJSP関数モジュールページはまだ読み込まれていないためです（ただし、関数モジュールJSページに対応するJSを導入するか、sea.jsを使用してJSファイルを読み込むことができますが、対応するJSファイルはHTMLまたはJSページがロードされている場合にのみロードされることです）、JSを使用してJSを使用することはできません。この時点で、最初にJSPページをロードする必要があります。たとえば、バックグラウンドにリクエストすることなく、Strutsでページをジャンプできます。つまり、背景に2つのリクエストを開始する必要があります。最初のリクエストは、対応する機能モジュールページをロードすることであり、2番目の要求はバックグラウンドからデータを要求し、最初のリクエストのページに入力して表示することです。
JSPコード：すべての静的コード
<div style = "overflow：auto; width：100％;*+width：1000px;"> <div> <h5>一貫性のないビジネス名</h5> <table> <thead> <tr> <th>顧客名</th> <th> iout通知金額</th> </tr> </thead> </tbody> </div> </div> </div>
ストラットのXMLファイル：
<action name = "RiskReLatedItem" method = "relatedItem"> </action> <！ - 関連するグループページにスキップ - > <アクションname = "riskrelatedItemswitch" = "relatedemswitch"> <result name = "success">/jsp/jsp/riskrecheck/riskrecheck/riskreletemitem.jss
または：
<！ - 関連するグループページにジャンプします - >アクションで対応するメソッドを書く必要はありません。Strutsがジャンプの責任を負います。 <アクションname = "riskReletiTemswitch"> <sults> /web-inf/jsp/riskrecheck/riskrelateditem.jsp </result> </action>
動作中のコード：
/ *** loanidに基づく関連グループメンバー情報query*/ public void relatedItem（）{list <loniskbean> tmprelatedList = null; try {tmprelatedList = riskRecheckserviceImpl.relatedItem（loanid）; this.OutputStreamModelandView（tmprelatedList）; } catch（Exception e）{e.printstacktrace（）; loggerutil.info（ "関連グループメンバー情報を表示するときに例外が発生しました！------関連項目（）"）;新しいruntimeexceptionを投げます（「関連するグループメンバー情報を表示するときに例外が発生しました！」）; }} / ***関連するメンバーグループページにジャンプ* @return* / public string relatedItemswitch（）{return success; }JSのコード：
/***ローン後の特別な検査入力情報表示 - 顧客情報[関連]グループディスプレイ*/$（document）.on（ 'click'、 '。'。関連 '、function（）{var loan = $（ "loanid"）; var urlswitch = "/hbpost/riskrecheck/riskrecheck/riskrecheck/riskrecheck/ var url = var url = var url = "/hbpost/riskrecheck/riskrelateditem.action？time="+new date（）+"＆loanid = "+loanid; = data.objed、for（var i = tmparray.length-1; i> = 0; i-）{tipstr == "同じアドレス"）{$（ "。 +tmparray [i] .duebillno +"</td> </tr>"）; css（ "display"、 "block"）} relatedinfo（）; relatedDialog = $ダイアログ（{id： 'relateddialog'、width：1000、title： "related fortation"、cancelvalue： "close '、content：data、onshow：function（）{$（"。arui-dialog "）。css（" max-height "、" 450px "）; $（ "。arui-dialog"）。 }}）}）上記は、JSP、Struts、Spring、MyBatisによるフロントエンドページ関数のモジュラー分割を実装するためのソリューションです。それがあなたに役立つことを願っています。ご質問がある場合は、メッセージを残してください。編集者は時間内に返信します。 wulin.comのウェブサイトへのご支援ありがとうございます！