Thymeleaf模板中路径跳转丢失应用上下文的问题求助

别担心，这个问题很常见，我帮你捋清楚怎么搞定它！

你遇到的核心问题是：直接写硬编码的路径/deviceDriver/updateauthorizeddriver/不会带上应用上下文（也就是你的driversApp），而你尝试用Thymeleaf的@{...}语法时，表达式写错了，导致没生效。

下面给你几种靠谱的解决方案：

方案一：先渲染基础路径，再拼接参数 #

先让Thymeleaf帮你生成带应用上下文的基础URL，之后再用JS拼接上选中的ID参数：

// 让Thymeleaf提前渲染出带上下文的基础路径
var baseUrl = /*[[@{/deviceDriver/updateauthorizeddriver/}]]*/ "";

$('#selectAuthorizedDriverId').change( function() { 
    var link = baseUrl + $(this).val(); 
    $(location).attr('href', link); 
});

Thymeleaf会把@{/deviceDriver/updateauthorizeddriver/}替换成完整的带上下文路径，比如/driversApp/deviceDriver/updateauthorizeddriver/，之后加上选中的ID，就能得到正确的跳转链接了。

方案二：在Thymeleaf表达式中直接拼接参数 #

如果你想一步到位生成完整URL，可以用Thymeleaf的占位符语法，同时把JS变量传入表达式：

$('#selectAuthorizedDriverId').change( function() { 
    var driverId = $(this).val();
    // 用双重包裹的方式把JS变量传给Thymeleaf表达式
    var link = /*[[@{/deviceDriver/updateauthorizeddriver/{id}(id=${__${driverId}__})}]]*/ "";
    $(location).attr('href', link); 
});

这里的${__${driverId}__}是Thymeleaf引用JS变量的特殊写法，它能把JS里的driverId值代入到URL的{id}占位符中，直接生成带上下文和参数的完整链接。

方案三：用HTML data属性分离逻辑 #

这种方式更清晰，把Thymeleaf的路径渲染放在HTML元素的data属性里，JS只负责读取和拼接：

<!-- 在select标签里添加data-url属性，让Thymeleaf渲染路径 -->
<select id="selectAuthorizedDriverId" data-url="[[@{/deviceDriver/updateauthorizeddriver/}]]">
    <!-- 你的下拉选项 -->
</select>

然后JS里这样写：

$('#selectAuthorizedDriverId').change( function() { 
    var baseUrl = $(this).data('url');
    var link = baseUrl + $(this).val(); 
    $(location).attr('href', link); 
});

这种方式把模板渲染和JS逻辑分开，代码可读性更高，也更容易维护。

你之前尝试的写法出错，主要是Thymeleaf表达式的语法写错了（少了开头的{），用上面任意一种方案都能解决404的问题~

内容的提问来源于stack exchange，提问作者Nunyet Calçada