Question

我有一个jQuery库，希望您将JavaScript对象作为选项传递给它。例如，这有效：

//Hardcoded JavaScript object
var myData = { "A" : "1", "B" : "2", "C" : "3" };

//Call to jQuery with object as an option
$("#mySelectorId").myJqueryFunction({values: myData});

我需要myData对象不要像那样硬连线。

我可以轻松地在我的Java代码中获得“A到1，B到2，C到3”结构，将它放在Map（或其他一些对象）中，然后通过它添加到请求中request.setAttribute("myData", myMap);。我只是不确定如何将Map（等）转换为所需的JavaScript对象。这是我尝试过的。

//Java
Map<String, String> myMap = new TreeMap<String, String>();
map.put("A", "1");
map.put("B", "2");
map.put("C", "3");
request.setAttribute("myMap", myMap);

//JSP
<c:set var="myData" value="{" />
<c:forEach var="mapEntry" items="${myMap}" varStatus="counter">
    <c:set var="myData" value="${myData}'${mapEntry.key}' : '${mapEntry.value}'" />
    <c:if test="${counter.count < fn:length(myMap)}">
        <c:set var="myData" value="${myData}, " />
    </c:if>
</c:forEach>
<c:set var="myData" value="${myData}}" />

<script>
    var myData = '${myData}';
    $("#mySelectorId").myJqueryFunction({values: myData});
</script>

这一直有效，直到myJqueryFunction到达试图做这样的事情：

var i = values[code];

本质上，它试图引用对象上的特定变量（例如，尝试获取“B”的值，即2）。请注意，code是一个保存A / B / C值的函数参数。

我已经尝试过包括或不包括${mapEntry.key}周围的引号和类似的事情，但似乎没有任何效果。

有谁知道如何使这个工作？

Answer 1

要在JavaScript中添加更多属性（包括变量），可以使用此语法

var myData = {}; // Initial object
myData["A"] = "1";
myData["B"] = "2";
myData["C"] = "3";

然后myData为{ "A" : "1", "B" : "2", "C" : "3" }。

Answer 2

自从我完成JSP之后已经有一段时间了，但是你在JSP myData调用的每次迭代中都覆盖了forEach var，而不是连接到它。其次，您对'myJqueryFunction'的调用在语法上是不正确的，而不是values: myData您可能想要使用{values: myData}。

第三，你可能不想通过JSP手动组装一个javascript对象，那里应该有适当的库来为你做。

Answer 3

一种解决方案是使用AJAX / JSON。

在新控制器中（让它映射到/MyControllerUrl），使用List并将其填充为包含字母和对象编号的对象（让我们调用这个新对象MyClass）。

List<MyClass> myList = new ArrayList<MyClass>();
myList.add(new MyClass("A", "1"));
myList.add(new MyClass("B", "2"));
myList.add(new MyClass("C", "3"));
request.setAttribute("myList", myList);

以上就是新控制器中的所有内容。返回的JSP只有以下内容。

<c:out value="[" />

<c:forEach var="listItem" items="${myList}" varStatus="counter">
    {"letter": "${listItem.letter}", "number": "${listItem.number}"}<c:if test="${counter.count < fn:length(myList)}">,</c:if>
</c:forEach>

<c:out value="]" />

最后，在原始JSP中，有以下内容。

<script>
    var myJsList= { };
    $.ajax({
        url: '${pageContext.request.contextPath}/MyControllerUrl',
        dataType: 'json',
        async: false,
        success: function(objectInfo) {
            $.each(objectInfo, function(key, object) {
                myJsList[object.code] = object.label;
            });
        }
    });
</script>

请注意，我使用了.ajax代替.getJSON，因此我可以设置async: false，以便变量可以立即供参考。

我不喜欢这个选项，因为它需要2个电话而不是1个。所以我会等着看是否有任何其他建议。

Answer 4

如果您将myData作为字符串获取，并且您无法删除'${myData}'周围的引号（这看起来很奇怪，那么你不能，BTW），那么试试这个：

将JSP的第一行更改为：

<c:set var="myData" value="var objMyData = {" />

将脚本更改为：

<script>
    var myData = '${myData}';
    eval(myData);
    $("#mySelectorId").myJqueryFunction({values: objMyData});
</script>

Java请求属性到JavaScript对象

4 个答案: