使用Jquery获取Thymeleaf参数的三种方式小结
作者:成为大佬先秃头
在使用Thymeleaf进行数据填充的时候,发现使用jquery原始方式获取内容参数发现拿不到数据,本文主要介绍了使用Jquery获取Thymeleaf参数的三种方式小结,感兴趣的可以了解一下
在使用Thymeleaf进行数据填充的时候,发现使用jquery原始方式获取内容参数发现拿不到数据。将百度后看到的解决方案整理下来,仅供参考。
方法一:内联获取
<script>标签中 th:inline 一定不能少,通常在取值的前后会加上不同的注释,不过个人觉得这样子写太麻烦了这么多括号!
<p th:text="#{message}">default message</p>
<script th:inline="javascript">
var message = [[${message}]];
console.log(message);
</script>
方法二:隐藏域获取
将参数放到隐藏域中在获取
<p th:value="#{message}" type="hidden" id="data">default message</p>
//获取隐藏域里面的参数
<script type="text/javascript">
var data=${"#data"}.val();
var data=$("#data").val();
</script>方法三:text文本获取
<p th:text="#{message}" id="data"></p>
<script type="text/javascript">
var bankCard1=$("#data").text();
</script>Jquery获取thymeleaf中checkbox的值
实现
thymeleaf页面代码
<button id="printBtn" class="btn btn-info mb_1em" type="button" onclick="return printDetails()"><i class="fa fa-paste"></i> 打印</button>
<table id="wmsInOrderDetail_table_id" class="table table-bordered hover" style="width:100%">
<thead>
<tr>
<th>序号</th>
<th>托盘编号</th>
<th>物料编号</th>
<th>物料名称</th>
<th>数量</th>
<th>供应商批次</th>
<th>生产日期</th>
<th>状态</th>
</tr>
</thead>
<tbody >
<tr th:each="orderlist:${wmsReceiveOrderDetailsVOList}" >
<td>
<input type="checkbox"
class="ads_Checkbox"
th:text="${orderlist.id}"
th:value="${orderlist.id}" name="checkedid"/>
</td>
<td th:text="${orderlist.salverCode}"></td>
<td th:text="${orderlist.materielId}"></td>
<td th:text="${orderlist.materielName}"></td>
<td th:text="${orderlist.num}"></td>
<td th:text="${orderlist.supplierBatch}"></td>
<td th:text="${#dates.format(orderlist.productDate, 'yyyy-MM-dd HH:mm:ss')}"></td>
<td th:text="${orderlist.statusName}"></td>
</tr>
</tbody>
</table>选中数据后,点击打印按钮,来到js中的方法。
function printDetails(){
debugger
var checkID = [];//定义一个空数组
$("input[name='checkedid']:checked").each(function(i){//把所有被选中的复选框的值存入数组
checkID[i] =$(this).val();
console.log(checkID);
});
}到此这篇关于使用Jquery获取Thymeleaf参数的三种方式小结的文章就介绍到这了,更多相关Jquery获取Thymeleaf参数内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
