JSP中如何在EL表达式内使用JavaScript变量获取对应Java值

核心原因 #

你尝试的写法无法生效，本质是EL表达式和JavaScript的执行时机完全错开：
EL属于服务端语法，会在JSP页面渲染阶段（页面还没返回给浏览器的时候）就在服务端执行完成，输出纯静态的内容到页面；而JavaScript变量是浏览器拿到返回的页面后，才在客户端运行生成的，服务端渲染EL的时候根本感知不到后续前端会生成的JS变量，自然无法直接调用。

可用实现方案 #

方案1：预渲染全量数据到前端JS对象（推荐，适合数据量不大的场景）

你可以提前在服务端把所有可能用到的键值对，一次性渲染成一个前端JS的全局映射对象，之后直接用前端的JS变量作为key取值即可：

<script>
// 服务端提前渲染所有选项映射
const optionValueMap = {
  // 固定选项可以直接写
  "key1": "${serverKey1}",
  "key2": "${serverKey2}",
  // 动态集合可以用JSTL循环输出
  <c:forEach items="${allServerOptions}" var="item">
    "${item.key}": "${item.value}",
  </c:forEach>
};

// 前端动态生成的option变量直接取值即可
var option = "你前端动态生成的key";
var value = optionValueMap[option];
</script>

方案2：AJAX异步请求（适合数据量较大、无法提前全量加载的场景）

如果可选的选项数量太多，全量预渲染会导致页面体积过大，可以在前端拿到option变量后，发起异步请求到后端接口获取对应的值：

var option = "你前端动态生成的参数";
// 发起请求
fetch('/api/getOptionValue?option=' + encodeURIComponent(option))
  .then(response => response.text())
  .then(value => {
    // 此处拿到需要的value，后续逻辑在这里处理
    console.log(value);
  });

方案3：分支判断（适合option可选值极少的场景）

如果option的可选值只有2-3种，也可以直接写分支判断硬编码：

var option = "动态生成的参数";
var value;
if (option === 'type1') {
  value = "${serverType1}";
} else if (option === 'type2') {
  value = "${serverType2}";
}

内容的提问来源于stack exchange，提问作者Jay Modi