在jstl中使用javascript变量

using javascript variable inside jstl

提问by coder247

I want to iterate a HashMap in javascript using jstl. is it possible to do like this?

我想使用jstl在javascript中迭代一个HashMap。有可能这样做吗？

function checkSelection(group,tvalue){
alert(group);
alert(tvalue);

<c:forEach items="${configuredGroupMap}" var="groupMap">
    alert("aa<c:out value="${groupMap.key}"/>");
    <c:if test="${groupMap.key==group}">
        alert("t<c:out value="${groupMap.key}"/>");
        <c:if test="${groupMap.value==tvalue}">
            alert("equal");
        </c:if>
    </c:if>
</c:forEach>
}

it's not going inside after

它不会进去之后

 <c:if test="${groupMap.key==group}">

采纳答案by Marimuthu Madasamy

"to iterate a HashMap in javascript using jstl" - Not possible

“使用jstl在javascript中迭代HashMap” - 不可能

JSTL is executed in server side by your servlet container for which Javascript is just a text which would be skipped whereas JavaScript is executed in client side where JSTL is unknown. After the server completes processing JSTL, the generated HTML(if any) from the JSTL along with other JavaScript/HTML will be rendered.

JSTL 由您的 servlet 容器在服务器端执行，其中 Javascript 只是一个将被跳过的文本，而 JavaScript 则在 JSTL 未知的客户端执行。服务器完成 JSTL 处理后，将从 JSTL 生成的 HTML（如果有）与其他 JavaScript/HTML 一起呈现。

For example, if you have this,

例如，如果你有这个，

<c:forEach var="myItem" items="${myCollection}">
alert('<c:out value="${myItem.id}">')
<c:if test="${myItem.id == 0}"> 
   alert("zero"); 
</c:if>
</c:forEach>

If the ids of the beans in the collection are 0, 1, 2, the server renders the following to the client side by executing the above code,

如果集合中 bean 的 id 为 0、1、2，则服务器通过执行上述代码将以下内容呈现给客户端，

alert('0')
alert('zero')
alert('1')
alert('2')

Now the browser will give you 4 alerts on loading the page (what if you have 10000 items, you will render 10000 alert statements to the browser). So the point is that you haven't iterated Java collection in JavaScript, you have simply generated a serious of Javascript statements in server iterating the collection using JSTL and you have provided those Javascript statements along with other html contents to browser.

现在浏览器会在加载页面时给你 4 个警报（如果你有 10000 个项目，你将向浏览器呈现 10000 个警报语句）。所以关键是您没有在 JavaScript 中迭代 Java 集合，您只是在使用 JSTL 迭代集合的服务器中生成了一系列 Javascript 语句，并且您已将这些 Javascript 语句与其他 html 内容一起提供给浏览器。

回答by JoseK

It is not possible because JSP is executed first at the server side, then the JavaScript gets executed at the client side.

这是不可能的，因为首先在服务器端执行 JSP，然后在客户端执行 JavaScript。

You can still use the c:forEachto loop through the ${configuredGroupMap}, but you cannot do the comparison across groupMap.keyand groupdirectly.

你仍然可以使用c:forEach通过循环${configuredGroupMap}，但你不能做比较跨groupMap.key和group直接。

Instead, a solution in this case is to assign the server-side groupMap.keyto a client-side variable in javascript first. Then use javascript for the if check, instead of c:if.

相反，这种情况下的解决方案是首先将服务器端分配给groupMap.keyjavascript 中的客户端变量。然后使用 javascript 进行 if 检查，而不是c:if.

I've modified your example to below

我已将您的示例修改为以下

function checkSelection(group,tvalue){ 
alert(group); 
alert(tvalue); 

<c:forEach items="${stringshm}" var="groupMap"> 
    alert("<c:out value="${groupMap.key}"/>"); 
    var groupKey = "<c:out value="${groupMap.key}"/>";

    if (groupKey == group){
        alert("<c:out value="${groupMap.key}"/>"); 

    var groupValue = "<c:out value="${groupMap.value}"/>";
        if (groupValue == tvalue){
            alert("both are equal"); 
    }
    }
</c:forEach> 
} 

回答by BalusC

Marimuthu has nailed it down. JavaScript and JSP/JSTL doesn't run in sync as you'd expect from the order in the coding. Java/JSP processes the page from top to bottom first, then the webserver sends the HTML/CSS/JS result to the webbrowser and finally the webbrowser processes the page (not containing any line of Java/JSP!) from top to bottom.

Marimuthu 已经确定了它。JavaScript 和 JSP/JSTL 不会像您期望的编码顺序那样同步运行。Java/JSP 首先从上到下处理页面，然后 webserver 将 HTML/CSS/JS 结果发送到 webbrowser，最后 webbrowser 从上到下处理页面（不包含任何 Java/JSP 行！）。

The best solution is to let JSP/JSTL generate a JavaScript object variable which you can later access in the JS code.

最好的解决方案是让 JSP/JSTL 生成一个 JavaScript 对象变量，您可以稍后在 JS 代码中访问它。

var groupMap = {
    <c:forEach items="${configuredGroupMap}" var="groupMap" varStatus="loop">
        "${groupMap.key}": "${groupMap.value}"${!loop.last ? ',' : ''}
    </c:forEach>
};

This will end up like the following in client side (rightclick page and View Sourceto be sure)

这将最终在客户端如下所示（右键单击页面并查看源代码）

var groupMap = {
    "key1": "value1",
    "key2": "value2",
    "key3": "value3"
};

Finally rewrite checkSelection()as follows:

最后改写checkSelection()如下：

function checkSelection(group, tvalue) {
    if (groupMap[group] == tvalue) {
        alert("equal");
    }
}

See also:

也可以看看：

• Communication between Java/JSP/JSF and JavaScript
• Essential JavaScript tutorial
• JSON (JavaScript Object Notation) tutorial

• Java/JSP/JSF 与 JavaScript 之间的通信
• 基本 JavaScript 教程
• JSON（JavaScript 对象表示法）教程