7-23 jsp页面转为html页面

2019独角兽企业重金招聘Python工程师标准>>>

1. <c:if    >-----<th:if    >

<c:if test="${sessionScope.UVO.guestName==null}">
	<meta http-equiv="REFRESH" content="0;url=initGuestLogin">
</c:if>

<span th:if="${sessionScope.UVO.guestName==null}">
	<meta http-equiv="REFRESH" content="0;url=initGuestLogin">
</span>

   2.  <form:form  >  <form:hidden   >----<form:    ><input: type="hidden"   >

<form:form modelAttribute="alipayForm" action="alipaySubmit" method="post">
	<form:hidden path="outTradeNo" value="${alipayForm.outTradeNo}"/>				<form:hidden path="subject" value="${alipayForm.subject}"/>					<form:hidden path="body" value="${alipayForm.body}"/>						<form:hidden path="price" value="${alipayForm.price}"/>
   <div class="about_wrapper">
         <h1>	该支付信息取自您登录的个人信息，请确认，如果有问题请您修改您的个人信息。</h1>
   </div>
   <div class="about-top">										<div class="grid span_2_of_3">	  								  <h3>客户订单号：${alipayForm.outTradeNo}</h3>							  <p>订单名称：${alipayForm.subject}</p>								  <p>订单描述：${alipayForm.body}</p>								  <p>付款金额：${alipayForm.price}</p>								  <div class="clear"></div>									</div>				
        <div class="clear"></div>
   </div>
   <input type="button" id="submitAlipay" class="button" value="登录支付宝结账" />
</form:form>

<form action="alipaySubmit" th:object="${alipayForm}" method="post">					<input type="hidden" name="outTradeNo" value=""	th:value="${alipayForm.outTradeNo}" /> 
        <input type="hidden" name="subject" value="" th:value="${alipayForm.subject}" /> 
        <input type="hidden" name="body" value="" th:value="${alipayForm.body}" />
        <input type="hidden" name="price" value="" th:value="${alipayForm.price}" /> 
    <div class="about_wrapper">										<h1>该支付信息取自您登录的个人信息，请确认，如果有问题请您修改您的个人信息。</h1>
    </div>
    <div class="about-top">
      <div class="grid span_2_of_3">
        <h3> 客户订单号：<span th:text="${alipayForm.outTradeNo}"></span>	</h3>
        <p> 订单名称：<span th:text="${alipayForm.subject}"></span></p>
        <p> 订单描述：<span th:text="${alipayForm.body}"></span></p>
        <p> 付款金额：<span th:text="${alipayForm.price}"></span></p>
      </div>
      <div class="clear"></div>
    </div>
   <div class="clear"></div>
   <input type="button" id="submitAlipay" class="button" value="登录支付宝结账" />
</form>

    3.   <jsp:include    >----<div: th: replace   >

<div class="header-para">
	<jsp:include page="/WEB-INF/jsp/shop/rightBar.jsp"></jsp:include>
</div>

<div class="header-para">
	<div th:replace="shop/rightBar :: page-right-bar"></div>
</div>

   4.   <c:choose    > <c:when   >----<th:if    >

<c:choose>
  <c:when test="${sessionScope.UVO.guestName==null}">
    <li class="act first"><a href="initGuestRegister">
      <div class="button-t"><span>注册新用户</span></div></a>
    </li>
    <li class="last"><a href="initGuestLogin">
       <div class="button-t"><span>登录</span></div></a>
    </li>
  </c:when>
  <c:otherwise>
    <li class="act first"><a href="initEditGuest">
      <div class="button-t"> <span>${sessionScope.UVO.guestName}</span></div></a>
    </li>
    <li class="last">
       <a href="${pageContext.request.contextPath}/">
           <div class="button-t"><span>退出</span></div>
       </a>
     </li>
  </c:otherwise>
</c:choose>

<ul class="user_menu" th:fragment="page-user-bar">
   <li class="act first" th:if="${#strings.isEmpty(session.UVO.guestName)}">
      <a th:href="@{initGuestRegister}"><span class="button-t" >注册新用户</span></a>
   </li>
   <li class="last" th:if="${#strings.isEmpty(session.UVO.guestName)}">
	<a th:href="@{initGuestLogin}"><span class="button-t">登录</span></a>
   </li>
   <li class="act first" th:if="${not #strings.isEmpty(session.UVO.guestName)}">
       <a th:href="@{initEditGuest}"><span class="button-t" th:text="${session.UVO.guestName}">张三
       </span></a>
    </li>
    <li class="last" th:if="${not #strings.isEmpty(session.UVO.guestName)}">
	<a th:href="@{/}"><span class="button-t">退出</span></a>
    </li>
</ul >

  5.  下面的这些标签内容不变--<link:   ><meta:   ><script    >

<link href="shop/css/style.css" rel="stylesheet" type="text/css"
	media="all" />
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script src="shop/js/jquery.min.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		$("#submitAlipay").click(function() {
			alipayForm.target = "newWindow";
			var win = window.open("about:blank", "newWindow");
			win.focus();
			alipayForm.submit();
			window.location.href = "initGoods?type=liangshi";
		});
	});
</script>

 6. 上面的代码为JQuery，<script>标签为脚本语言，分为普通脚本语言与JQuery，若含有“$”和“#”符号就可归为JQuery，document包含<html > </html>中的所有标签，window为一个窗口，

$(document).ready(function() ------表示开始一个新的功能

$("#submitAlipay").click(function() -------"#submitAlipay"中的click事件发生时或触发功能

alipayForm.target = "newWindow";  -------跳到一个新的窗口

var win = window.open("about:blank", "newWindow"); -----创建一个新的空白窗口"newWindow"

win.focus(); -----聚焦新的窗口

alipayForm.submit();-----提交alipayForm的表单信息

window.location.href = "initGoods?type=liangshi"; -------跳转到initGoods，刷新首页

转载于:https://my.oschina.net/u/2411782/blog/482701