jsp语法转换为thyemleaf
来源：互联网 发布：陌生人语音聊天软件 编辑：程序博客网 时间：2024/05/21 07:48
1、含有js的jsp页面 java 类中用model进行数据的传递
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%><script type="text/javascript"> var pickCallBack = ${iCallBack}; var pickCallBackParam = '${iCallBackParam}'; var pickRadio ="${radio}"; var pickTag = "${tag}"; var pickTagName = "${tagName}"; function pickCheck(id,isRadio) { if ($("#"+id).is(':checked')) { $("#"+id).prop("checked", false); $("#d_"+id).removeClass("pickActive"); } else { $("#"+id).prop("checked", true); $("#d_"+id).addClass("pickActive"); if(isRadio=='true'){ $("#pickContent div").removeClass("pickActive") setPick(); } } navigateText = ""; $("#pickTip").html(navigateText); $("#pickTip").css("display","none"); } document.onkeydown = function(event) { if (event.keyCode == 13) { setPick(); } } /* 关闭下拉快速定位 if(hasLoad==0){ $(document).ready(keyMonitor()); } */ </script><div class="form-group"> <blockquote> <p class="f12 fb pl10 tl C999">选择后回车即可快速确认，键盘输入可快速定位，退格可删除输入</p> </blockquote></div><div id="pickContent"> ${pickContent}</div><c:if test="${radio!='true'}"><div class="fr w border-t ml10 tr pt10 form-group"> <button type="button" class="btn btn-info form-control" onclick="setPick()">选择</button></div></c:if>转换后的
<html xmlns:th="http://www.thymeleaf.org"> <script th:inline="javascript" >/*<![CDATA[*/ var pickCallBack = eval([[${iCallBack}]]) ; var pickCallBackParam = [[${iCallBackParam}]]; var pickRadio =[[${radio}]]; var pickTag =[[${tag}]]; var pickTagName = [[${tagName}]]; function pickCheck(id,isRadio) { if ($("#"+id).is(':checked')) { $("#"+id).prop("checked", false); $("#d_"+id).removeClass("pickActive"); } else { $("#"+id).prop("checked", true); $("#d_"+id).addClass("pickActive"); if(isRadio=='true'){ $("#pickContent div").removeClass("pickActive"); setPick(); } } navigateText = ""; $("#pickTip").html(navigateText); $("#pickTip").css("display","none"); } document.onkeydown = function(event) { if (event.keyCode == 13) { setPick(); } } /* 关闭下拉快速定位 if(hasLoad==0){ $(document).ready(keyMonitor()); } */ /*]]>*/ </script><div class="form-group"> <blockquote> <p class="f12 fb pl10 tl C999">选择后回车即可快速确认，键盘输入可快速定位，退格可删除输入</p> </blockquote></div><div id="pickContent" th:utext="${pickContent}"> </div><div th:if="${radio!='true'}"> <div class="fr w border-t ml10 tr pt10 form-group"> <button type="button" class="btn btn-info form-control" onclick="setPick()">选择</button> </div></div></html>2.还有样式便利的jsp转为thyemleaf
<%@ page contentType="text/html;charset=UTF-8"%><%@ page isELIgnored="false"%><%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><style type="text/css"><!--font-family: SimSun;--> body { font-family: "Lantinghei SC", "Open Sans", Arial, "Hiragino Sans GB", "Microsoft YaHei", "STHeiti", "WenQuanYi Micro Hei", SimSun, sans-serif; } pre { border: 0px; color: #595959; font-weight: 100; line-height: 24px; font-size: 12px; } td{padding:5px;} tr{background:#F0F0F0;} h1,h2,h3,h4,h5{color:#000000;} </style></head><body screen_capture_injected="true" ryt11773="1" style="padding:10px;"> <!-- 标题 --> <div style="padding-left:4px;padding-bottom:0px; background:#fff; color:${MAIN_COLOR};font-size:18px;font-weight:bold;"> </div> <div style="padding-right:4px;background:#fff; color:#999;font-size:12px;text-align:right;"> 本系统由CrapApi【crap.cn】提供技术支持 </div> <div style="clear:both;height:2px;width:100%;background:${MAIN_COLOR};"></div> <!-- 列表 --> <div style="font-size:18px;line-height:36px; color:${MAIN_COLOR};padding:15px;background:#eeeeee;"> <div style="color:#000000;font-size:20px;">目录</div> <c:forEach var="f" items="${requestScope.interfaces}" varStatus="status"> ${ status.index + 1}. ${f.model.interfaceName}<br/> </c:forEach> </div> <!-- 内容 --> <c:forEach var="f" items="${requestScope.interfaces}" varStatus="status"> <div style="height:20px;"></div> <div style="padding:20px;padding-top:10px;background:#f6f6f6; margin-top:20px;font-size:14px;color:#999;"> <div style="margin-left:-10px;font-size:18px;font-weight:bold;color:${MAIN_COLOR};">${ status.index + 1}、 ${f.model.interfaceName}</div> <h3>1 功能说明</h3> ${f.model.remark} <br/> <h3>2 URL地址</h3> ${f.model.moduleUrl}${f.model.url} <br/> <br/> <h3>3 版本号</h3> ${f.model.version} <br/> <br/> <h3>4 Mock地址</h3> 正确：${f.trueMockUrl}<br/> 错误：${f.falseMockUrl} <br/> <br/> <h3>3 HTTP请求方式</h3> ${f.model.method} <br/> <br/> <h3>4 请求头说明</h3> <table style="width:100%;"> <tr style="background:${MAIN_COLOR};color:#fff;"> <td>名称</td> <td>是否必须</td> <td>类型</td> <td>默认值</td> <td style="width:260px;">备注</td> </tr> <c:forEach var="v" items="${f.headers}"> <tr> <td>${v.name}</td> <td>${v.necessary}</td> <td>${v.type}</td> <td>${v.def}</td> <td>${v.remark}</td> </tr> </c:forEach> </table> <br/> <h3>5 输入参数说明<c:if test="${f.customParams!=null}">(自定义参数)</c:if></h3> <c:if test="${f.formParams!=null}"> <table style="width:100%;"> <tr style="background:${MAIN_COLOR};color:#fff;"> <td>名称</td> <td>是否必须</td> <td>参数位置</td> <td>类型</td> <td>默认值</td> <td style="width:260px;">备注</td> </tr> <c:forEach var="v" items="${f.formParams}"> <tr> <td>${v.name}</td> <td>${v.necessary}</td> <td>${v.inUrl=='true'?'URL地址':'普通参数'}</td> <td>${v.type}</td> <td>${v.def}</td> <td>${v.remark}</td> </tr> </c:forEach> </table> </c:if> <c:if test="${f.customParams!=null}"> <h5 style="color:#999999;">请求示列</h5> ${f.customParams} <br/><br/> <h5 style="color:#999999;">参数备注</h5> <table style="width:100%;"> <tr style="background:${MAIN_COLOR};color:#fff;"> <th style="width:30px;"></th> <th>名称</th> <th style="width:60px;">类型</th> <th style="width:50px;">是否必须</th> <th style="width:80px;">备注</th> </tr> <c:forEach var="v" items="${f.paramRemarks}"> <tr> <td style="color:red;">${v.deep}</td> <td style="padding-left:20px;"> <div style="padding-left: ${v.deep*10}px;">${v.name}</div> </td> <td>${v.type}</td> <td>${v.necessary}</td> <td>${v.remark}</td> </tr> </c:forEach> </table> </c:if> <br/> <h3>6 请求示例</h3> <div style="background:#F0F0F0; padding:10px;"> <pre style="font-family: SimSun;">${f.model.requestExam}</pre> </div> <br/> <h3>7 返回参数说明</h3> <table style="width:100%;"> <tr style="background:${MAIN_COLOR};color:#fff;"> <th style="width:30px;"></th> <th>名称</th> <th style="width:60px;">类型</th> <th style="width:50px;">是否必须</th> <th style="width:80px;">备注</th> </tr> <c:forEach var="v" items="${f.responseParam}"> <tr> <td style="color:red;">${v.deep}</td> <td style="padding-left:20px;"> <div style="padding-left: ${v.deep*10}px;">${v.name}</div> </td> <td>${v.type}</td> <td>${v.necessary}</td> <td>${v.remark}</td> </tr> </c:forEach> </table> <br/> <h3>8 正确返回示例</h3> <div style="background:#F0F0F0; padding:10px;"> <pre>${f.model.trueExam}</pre> </div> <br/> <h3>9 错误返回示例</h3> <div style="background:#F0F0F0; padding:10px;"> <pre>${f.model.falseExam}</pre> </div> <br/> <h3>10 错误码</h3> <table style="width:100%;"> <tr style="background:${MAIN_COLOR};color:#fff;"> <td>Code</td> <td>Msg</td> </tr> <c:forEach var="v" items="${f.errors}"> <tr> <td>${v.errorCode}</td> <td>${v.errorMsg}</td> </tr> </c:forEach> </table> </div> </c:forEach></body></html>转换后
<html xmlns:th="http://www.thymeleaf.org"> <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><style type="text/css"><!--font-family: SimSun;--> body { font-family: "Lantinghei SC", "Open Sans", Arial, "Hiragino Sans GB", "Microsoft YaHei", "STHeiti", "WenQuanYi Micro Hei", SimSun, sans-serif; } pre { border: 0px; color: #595959; font-weight: 100; line-height: 24px; font-size: 12px; } td{padding:5px;} tr{background:#F0F0F0;} h1,h2,h3,h4,h5{color:#000000;} </style></head><body screen_capture_injected="true" ryt11773="1" style="padding:10px;"> <!-- 标题 --> <div th:style="'padding-left:4px;padding-bottom:0px; background:#fff; color:'+${MAIN_COLOR}+';font-size:18px;font-weight:bold;'"> <span th:text="${title}">--模块</span>【<span th:text="${moduleName}"></span>】 </div> <div style="padding-right:4px;background:#fff; color:#999;font-size:12px;text-align:right;"> 本系统由内蒙古朗坤科技有限公司技术部提供技术支持 </div> <div th:style="'clear:both;height:2px;width:100%;background:'+${MAIN_COLOR}+';'"></div> <!-- 列表 --> <div th:style="'font-size:18px;line-height:36px; color:'+${MAIN_COLOR}+';padding:15px;background:#eeeeee;'" > <div style="color:#000000;font-size:20px;">目录</div> <div th:each="f,status:${interfaces}" > <span th:text="${status.index + 1}">.</span><span th:text="${f.model.interfaceName}"></span><br/> </div> </div> <div th:each="f,status:${interfaces}" > <div style="height:20px;"></div> <div style="padding:20px;padding-top:10px;background:#f6f6f6; margin-top:20px;font-size:14px;color:#999;"> <div th:style="'margin-left:-10px;font-size:18px;font-weight:bold;color:'+${MAIN_COLOR}+';'"> <span th:text="${ status.index + 1}"></span>、<span th:text="${f.model.interfaceName}"></span> </div> <h3>1 功能说明</h3> <span th:text="${f.model.remark}"></span> <br/> <h3>2 URL地址</h3> <span th:text="${f.model.moduleUrl}"></span> <span th:text="${f.model.url}"></span> <br/> <br/> <h3>3 版本号</h3> <span th:text="${f.model.version}"></span> <br/> <br/> <h3>4 Mock地址</h3> 正确：<span th:text="${f.trueMockUrl}"></span> <br/> 错误：<span th:text="${f.falseMockUrl}"></span> <br/> <br/> <h3>3 HTTP请求方式</h3> <span th:text="${f.model.method}"></span> <br/> <br/> <h3>4 请求头说明</h3> <table style="width:100%;"> <tr th:style="'background:'+${MAIN_COLOR}+';color:#fff;'"> <td>名称</td> <td>是否必须</td> <td>类型</td> <td>默认值</td> <td style="width:260px;">备注</td> </tr> <div th:each="v,status:${f.headers}" > <tr> <td th:text="${v.name}"></td> <td th:text="${v.necessary}"></td> <td th:text="${v.type}"></td> <td th:text="${v.def}"></td> <td th:text="${v.remark}"></td> </tr> </div> </table> <br/> <h3>5 输入参数说明<div th:if="${f.customParams!=null}">(自定义参数)</div></h3> <div th:if="${f.formParams!=null}"> <table style="width:100%;"> <tr th:style="'background:'+${MAIN_COLOR}+';color:#fff;'"> <td>名称</td> <td>是否必须</td> <td>参数位置</td> <td>类型</td> <td>默认值</td> <td style="width:260px;">备注</td> </tr> <div th:each="v,status:${f.formParams}" > <tr> <td th:text="${v.name}"></td> <td th:text="${v.necessary}"></td> <td th:text="${v.inUrl=='true'?'URL地址':'普通参数'}"></td> <td th:text="${v.type}"></td> <td th:text="${v.def}"></td> <td th:text="${v.remark}"></td> </tr> </div> </table> </div> <div th:if="${f.customParams!=null}"> <h5 style="color:#999999;">请求示列</h5> ${f.customParams} <br/><br/> <h5 style="color:#999999;">参数备注</h5> <table style="width:100%;"> <tr th:style="'background:'+${MAIN_COLOR}'+;color:#fff;'"> <th style="width:30px;"></th> <th>名称</th> <th style="width:60px;">类型</th> <th style="width:50px;">是否必须</th> <th style="width:80px;">备注</th> </tr> <div th:each="v,status:${f.paramRemarks}" > <tr> <td style="color:red;" th:text="${v.deep}"></td> <td style="padding-left:20px;"> <div th:style="'padding-left:'+${v.deep*10}+'px;'" th:text="${v.name}"></div> </td> <td th:text="${v.type}"></td> <td th:text="${v.necessary}"></td> <td th:text="${v.remark}"></td> </tr> </div> </table> </div> <br/> <h3>6 请求示例</h3> <div style="background:#F0F0F0; padding:10px;"> <pre style="font-family: SimSun;" th:text="${f.model.requestExam}"></pre> </div> <br/> <h3>7 返回参数说明</h3> <table style="width:100%;"> <tr th:style="'background:'+${MAIN_COLOR}+';color:#fff;'"> <th style="width:30px;"></th> <th>名称</th> <th style="width:60px;">类型</th> <th style="width:50px;">是否必须</th> <th style="width:80px;">备注</th> </tr> <div th:each="v,status:${f.responseParam}" > <tr> <td style="color:red;" th:text="${v.deep}"></td> <td style="padding-left:20px;"> <div th:style="'padding-left:'+${v.deep*10}+'px;'" th:text="${v.name}"></div> </td> <td th:text="${v.type}"></td> <td th:text="${v.necessary}"></td> <td th:text="${v.remark}"></td> </tr> </div> </table> <br/> <h3>8 正确返回示例</h3> <div style="background:#F0F0F0; padding:10px;"> <pre th:text="${f.model.trueExam}"></pre> </div> <br/> <h3>9 错误返回示例</h3> <div style="background:#F0F0F0; padding:10px;"> <pre th:text="${f.model.falseExam}"></pre> </div> <br/> <h3>10 错误码</h3> <table style="width:100%;"> <tr th:style="'background:'+${MAIN_COLOR}+';color:#fff;'"> <td>Code</td> <td>Msg</td> </tr> <div th:each="v,status:${f.errors}" > <tr> <td th:text="${v.errorCode}"></td> <td th:text="${v.errorMsg}"></td> </tr> </div> </table> </div> </div> <!-- 内容 --> </body></html>阅读全文
0 0
- jsp语法转换为thyemleaf
- thyemleaf相关语法
- jsp转换为Servlet规则
- eclipse中html转换为jsp文件
- jsp语法
- JSP语法
- JSP语法
- JSP语法
- jsp语法
- Jsp语法
- JSP语法
- jsp语法
- JSP语法
- JSP语法
- JSP语法
- JSP语法
- JSP语法
- JSP语法
- LeetCode 606：Construct String from Binary Tree （c++）
- input和textarea的区别
- java程序导入Excel表数据
- 斯坦福cs224d 语言模型，RNN，LSTM与GRU
- python写算法题：leetcode: 21. Merge Two Sorted Lists
- jsp语法转换为thyemleaf
- Redis 该选择哪种持久化配置
- java笔记-LinkedList面试复习
- 欢迎使用CSDN-markdown编辑器
- linux下文件恢复工具extundelete
- 基于ServerSocket的多人聊天室模拟实现
- 命令模式Command（对象行为型）
- Ajax 的传统实现 实例
- Hive的数据类型与基础操作
