怎么样实现左侧页面点击后右边页面显示内容
2019獨角獸企業重金招聘Python工程師標準>>>
實現結果圖片
前端頁面的代碼
<div class="row">
<div class="col-md-2 ceterL">
<ul class="centerMenu cf ">
<li class="curr"><a href="aboutUs">關于我們</a><i></i></li>
<li><a href="contactUs">聯系我們</a><i></i></li>
</ul>
</div>
<div class="col-md-10 ceterR">
? ?<div class="fb about-title yh detailsT">關于我們</div>
? ? ? ? ? ? ? ? <div class="about-cont">
? ? ? ? ? ? ? ? ? <p class="f12">好農易商城是天津濱海新區新興的一家集農產品、調料、沖飲、茗茶及化妝品等種類為一體的大型購物網站,主打農產品遵從綠色、有機、自然,無公害,為用戶提供放心食材,深受廣大用戶喜愛。</p>
? ? ? ? ? ? ? ? ? <p class="f12"><span class="fb f14">主營業務</span><br/>糧食、調料、化妝品、沖飲、零食、茗茶等。</p>
? ? ? ? ? ? ? ? ? <p class="f12"><span class="fb f14">經營優勢</span><br/>1、源頭采購,正品保證。<br/>2、一流倉儲,閃電配送。<br/>3、貨真價廉,讓利顧客。</p>
? ? ? ? ? ? ? ? </div>
?</div>
</div>
根據鏈接實現到controller的跳轉以及返回的頁面
? ? @RequestMapping(value = "aboutUs", method = RequestMethod.GET)
? ? public String aboutUs(Model model, HttpSession session, Device device) {
? ? UVO uvo=(UVO) session.getAttribute("UVO");
? ?if (uvo == null) {
? uvo = new UVO();
? session.setAttribute("UVO", uvo);
? }//用來設置當前session中的值
? GoodsForm goodsForm = new GoodsForm();
List<GoodsForm> commodityType = goodsService.getType();
goodsForm.setCommodityTypeId(commodityType.get(0).getCommodityTypeId());
model.addAttribute("goodsForm", goodsForm);//完成頁面中用到的menu的檢索
model.addAttribute("commodityType",commodityType);
CartForm cartForm=new CartForm();
cartForm.setGuestId(uvo.getGuestId());
cartForm.setStatus("未付款");
model.addAttribute("cartList", cartService.searchCartList(cartForm));//用來實現在頁面中顯示的購物車的沙青年宮品數
? ? if(device.isNormal()) {
? ? return "shop/aboutUs";
? ? } else {
? ? return "mobile/aboutUs";//返回的界面
? ? }
? ? }
? ??
? ? @RequestMapping(value = "contactUs", method = RequestMethod.GET)
? ? public String contactUs(Model model, HttpSession session, Device device) {
? ? UVO uvo=(UVO) session.getAttribute("UVO");
? ?if (uvo == null) {
? uvo = new UVO();
? session.setAttribute("UVO", uvo);
? }
? ?GoodsForm goodsForm = new GoodsForm();
? List<GoodsForm> commodityType = goodsService.getType();
? goodsForm.setCommodityTypeId(commodityType.get(0).getCommodityTypeId());
? model.addAttribute("goodsForm", goodsForm);
? model.addAttribute("commodityType",commodityType);
? CartForm cartForm=new CartForm();
cartForm.setGuestId(uvo.getGuestId());
cartForm.setStatus("未付款");
model.addAttribute("cartList", cartService.searchCartList(cartForm));
? ? ? if(device.isNormal()) {
? ? return "shop/contactUs";
? ? } else {
? ? return "mobile/contactUs";
? ? }?//基本類似上面?
? ? }
SQL文
<select id="selectCartList" parameterClass="cn.agriculture.web.form.CartForm"
resultClass="cn.agriculture.web.form.CartForm">
SELECT cart.cart_id as cartId,
cart.guest_id as guestId,
cart.count as count,
commodity.commodity_id as commodityId,
commodity.type as type,
supplier.supplier_name as supplierName,
brand.brand_name as brandName,
commodity.commodity_name as commodityName,
commodity.weight as weight,
commodity.is_gift as isGift,
commodity.specifications as specifications,
commodity.unit as unit,
commodity.benchmark_price as benchmarkPrice,
commodity.guide_price as guidePrice,
commodity.retail_price as retailPrice,
commodity.competition_level as competitionLevel,
commodity.note as note,
cart.update_time as updateTime,
cart.update_user as updateUser,
commodity.picture_id as pictureId
FROM cart, commodity, supplier, brand
WHERE cart.commodity_id = commodity.commodity_id
AND commodity.supplier_id = supplier.supplier_id
AND commodity.brand_id = brand.brand_id
AND cart.status = #status#
AND cart.guest_id = #guestId#
</select>
轉載于:https://my.oschina.net/u/2411987/blog/491733
總結
以上是生活随笔為你收集整理的怎么样实现左侧页面点击后右边页面显示内容的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Ionic系列——调用摄像头拍照和选择图
- 下一篇: 居中的六种方法