thymeleaf遇到的各种神坑

1.javascript里面引用后端传过来的对象

JS部分代码一定要这样写,包括注释部分,也不能少,不要问我什么,去问变态作者吧

<script type="text/javascript" th:inline="javascript"> /*<![CDATA[*/ /*]]>*/ </script>

在js部分使用路径时候,要这样写:

var path = /*[[@{/permission/applyList}]]*/;

在url中带入多个参数写法:

<li><a th:href="@{/permission/applyList/(currentPage=${page.currentPage},pageSize=5 )}">5</a></li>

在标签中调用后台方法写法:

总条数：<span th:text="${page.getTotalCount()}"></span>&nbsp;&nbsp;

写onclick事件的写法(这个尤其变态)

<a href="#" th:οnclick=" 'javascript:permission_audit('+ ${item.approveId} +') '">

   <span class="label label-primary">通过</span>

</a>

<a href="#" th:οnclick=" 'javascript:permission_back('+ ${item.approveId} +') '">

   <span class="label label-danger">退回</span>

</a>

if判断的写法:

<td th:if="${item.status == 1}"><span class="label label-success">已审核</span></td>

jsp include指令的替代写法

<div th:replace="head"></div>

form的action写法:

<form class="form-horizontal" th:action="@{/job/save}" method="post">

select下拉框迭代器+数据回显写法:

<div class="form-group">

   <label class="col-sm-2 control-label">任务类型</label>

   <div class="col-sm-10">

      <select class="form-control " id="jobType" name="jobType" th:field="${jobInfo.jobType}">

         <option th:each="label : ${jobTypes}" th:value="${label.value}" th:text="${label.value}"></option>

      </select>

   </div>

</div>

form里面的input框数据回显写法

<div class="form-group">

   <label class="col-sm-2 control-label">执行参数</label>

   <div class="col-sm-10">

      <input th:value="${jobInfo.execParams}" type="text" class="form-control" id="execParams" name="execParams" data-           message-required="请填写执行参数." placeholder="请填写执行参数" />

   </div>

</div>

ID隐藏域写法

<div class="form-group">

   <div class="form-group">

      <input th:if="${jobInfo} != null" id="id" name="id" type="hidden" th:value="${jobInfo} ? ${jobInfo.id}" />

   </div>

</div>

table数据表格展示数据循环写法:

<table id="dataTable" class="table table-bordered table-striped">

   <thead>

      <tr>

         <th>Id</th>

         <th>名称</th>

      </tr>

   </thead>

   <tbody>

<!-- 这里对应后端带回一个名叫"list"的变量 -->

      <tr th:each="item:${list}">

<!-- fancybox超链接插件 -->

         <td>

            <a th:href="@{/job/detail/(id=${item.id})}" class="fancybox" data-fancybox-type="iframe">

               <span th:text="${item.id}" class="label label-default"></span>

            </a>

         </td>

         <td th:text="${item.jobName}"></td>

      </tr>

   </tbody>

</table>

引用css,JS的写法

<link th:href="@{/plugins/fancybox/jquery.fancybox.css}" type="text/css" rel="stylesheet" />

<!-- DataTables -->

<script th:src="@{/plugins/datatables/jquery.dataTables.min.js}"></script>

<script th:src="@{/plugins/datatables/dataTables.bootstrap.min.js}"></script>