在jstl中使用javascript變量

Question

我想使用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>
}

之后不會進去

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

Answer 1

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

JSTL是在服務器端由您的servlet容器執行的，對於該容器來說，Javascript只是可以跳過的文本，而JavaScript在未知JSTL的客戶端中執行。 服務器完成對JSTL的處理后，將從JSTL生成的HTML（如果有）與其他JavaScript / HTML一起呈現。

例如，如果您有這個，

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

如果集合中Bean的ID為0、1、2，則服務器通過執行上述代碼將以下內容呈現給客戶端，

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

現在，瀏覽器將在加載頁面時為您提供4條警報（如果您有10000個項目，則將向瀏覽器呈現10000條警報語句）。 因此，關鍵是您沒有在JavaScript中迭代Java集合，只是在服務器上使用JSTL迭代了該集合中的大量Javascript語句，並且已將這些Javascript語句以及其他html內容提供給瀏覽器。

Answer 2

這是不可能的，因為JSP首先在服務器端執行，然后在客戶端執行JavaScript。

您仍然可以使用c:forEach遍歷${configuredGroupMap} ，但是不能直接在groupMap.key和group之間進行比較。

相反，這種情況下的解決方案是先將服務器端groupMap.key分配給javascript中的客戶端變量。 然后使用javascript進行if檢查，而不是c:if 。

我已將您的示例修改為以下內容

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> 
} 

Answer 3

Marimuthu已將其固定下來。 JavaScript和JSP / JSTL不會按照您期望的順序同步運行。 Java / JSP首先從上到下處理頁面，然后網絡服務器將HTML / CSS / JS結果發送到Web瀏覽器，最后，Web瀏覽器從上到下處理頁面（不包含Java / JSP的任何行！）。

最好的解決方案是讓JSP / JSTL生成一個JavaScript對象變量，您以后可以在JS代碼中對其進行訪問。

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

最終結果將類似於客戶端中的以下內容（請確保右鍵單擊頁面和“ 查看源代碼” ）

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

最后，如下重寫checkSelection() ：

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

也可以看看：

• Java / JSP / JSF與JavaScript之間的通信
• 基本的JavaScript教程
• JSON（JavaScript對象表示法）教程