Thymeleaf 在js中拼接 uri 的使用

AllBull

已于 2022-05-18 14:43:27 修改

阅读量881

点赞数

CC 4.0 BY-SA版权

分类专栏：前端文章标签： javascript 前端 json

于 2022-03-02 22:41:13 首次发布

本文链接：https://blog.csdn.net/weixin_48328037/article/details/123242327

前端专栏收录该内容

1 篇文章

订阅专栏

本文介绍了如何在JavaScript中利用Thymeleaf模板引擎来正确拼接URI。通过添加Thymeleaf的jar包，并在JS字符串中使用`[[${#request.getContextPath()}]]/workbench/index.do`的语法，可以实现URI的动态解析。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

源代码：

	<script type="text/javascript">
		$(function () {
			//登录事件
			$("#loginBtn").click(function () {
				//收集参数
				var loginAct = $.trim($("#loginAct").val());
				var loginPwd = $.trim($("#loginPwd").val());
				var isRemPwd = $.trim($("#isRemPwd").prop("checked"));
				//验证参数
				if (loginAct==""){
					alert("用户名不能为空");
					return;
				}
				if (loginPwd==""){
					alert("密码不能为空");
					return;
				}
				//发送请求
				$.ajax({
					url:'settings/qx/user/login.do',
					data:{
						loginAct:loginAct,
						loginPwd:loginPwd,
						isRemPwd:isRemPwd
					},
					type:'post',
					// 返回类型为json
					dataType:'json',
					success:function (data) {
						if (data.code == "1"){
							//登录成功 -> 跳转到业务页面
							//这里的thymeleaf语法，在js中使用thymeleaf拼接uri， 引擎直接解析？  直接
							window.location.href="[[${#request.getContextPath()}]]/workbench/index.do";
						}else {
							//登录失败，显示提示信息
							$("#msg").html(data.message);
						}
					}
				});
			});
		});
	</script>

已经添加了thymeleaf的jar包

经过解析之后：

<script type="text/javascript">
		$(function () {
			//登录事件
			$("#loginBtn").click(function () {
				//收集参数
				var loginAct = $.trim($("#loginAct").val());
				var loginPwd = $.trim($("#loginPwd").val());
				var isRemPwd = $.trim($("#isRemPwd").prop("checked"));
				//验证参数
				if (loginAct==""){
					alert("用户名不能为空");
					return;
				}
				if (loginPwd==""){
					alert("密码不能为空");
					return;
				}
				//发送请求
				$.ajax({
					url:'settings/qx/user/login.do',
					data:{
						loginAct:loginAct,
						loginPwd:loginPwd,
						isRemPwd:isRemPwd
					},
					type:'post',
					// 返回类型为json
					dataType:'json',
					success:function (data) {
						if (data.code == "1"){
							//登录成功 -> 跳转到业务页面
							window.location.href="/crm/workbench/index.do";
						}else {
							//登录失败，显示提示信息
							$("#msg").html(data.message);
						}
					}
				});
			});
		});
	</script>

没有使用

<script th:inline="javascript" type="text/javascript">

只是在js的字符串中利用的

"[[${#request.getContextPath()}]]/workbench/index.do"

便可以解析为拼接为正确的uri