元素列表json之后缺少]答案

【问题标题】：missing ] after element list json元素列表json之后缺少]
【发布时间】：2013-05-24 17:21:59
【问题描述】：

我正在尝试在 onclick 事件上调用 getPointOnMap 函数并为其提供一个 json 对象作为参数。

这里是代码示例：

$.ajax({
    type: "POST",
    url: "/getResult.json",
    success: function(result) {
        var html = '';
        for (var i = 0; i < result.length; i++) {
            var obj = result[i];
            html += "<input type='checkbox' onClick='getPointOnMap(" + obj + ")'/>" + obj.address + "<br>";
        }
        $("#myDiv").append(html);
    }
});

这里是函数getPointOnMap

function getPointOnMap(object) {
    map.addMarker({
        lat: object.lattitude,
        lng: object.longtitude,
        click: function(e) {
            alert('You clicked in this marker');
        }
    });
}

firebug 输出（也在问题名称中）：

SyntaxError: missing ] after element list

getPointOnMap([object Object])

我应该怎么做才能传递正确的对象？

【问题讨论】：

请注意，此问题因重复而应关闭：stackoverflow.com/questions/16813773/… 您应该删除您之前的问题。
您是否阅读过关于 @roasted 链接的完全相同问题的 cmets？
您返回的result 是什么？你应该可以在 Firebug 的“Net”标签中找到它
版主标记了它，因为他们不明白问题是什么，现在我已经更正了它，非常感谢获得答案，但不是缺点
@JohnSmith 如果需要，您可以删除自己的问题 - 请参阅 meta.stackexchange.com/questions/5221/…。多次转发同一个问题被认为是不好的做法。最好重新编写问题并要求重新打开 - 例如参见meta.stackexchange.com/questions/115608/re-open-closed-question

标签： javascript jquery json google-maps google-maps-api-3

【解决方案1】：

我认为不允许重新发布问题，无论如何，您不应通过字符串而是通过 DOM 创建 HTML 输入，因此您可以将处理程序附加到函数而不是“onclick”上。

$.ajax({
    type: "POST",
    url: "/getResult.json",
    success: function(result) {
        for (var i = 0; i < result.length; i++) {
            (function (n) {
                var obj = result[i],
                    element = $("<input>", {type: "checkbox"});
                element.click(function () {
                    getPointMap(obj);
                });
                $(document.body).append(element, obj.address + "<br />");
            })(i)
        }
    }
});

【讨论】：

我可能错了，但不是所有的 getPointMap 调用都会收到最后一个结果 [i] 作为此解决方案的参数吗？你应该测试你的答案。
两个问题：1) append 行不应该在for循环内吗？ 2）您必须在element.click(...) 之外创建一个附加范围，并将obj 放在该范围内。否则它将被 for 循环中的以下迭代覆盖，并且所有单击事件都将使用相同的参数调用 getPointMap。 jsfiddle.net/FCbpm
仅供参考，您可以将$("<input/>").attr("type", "checkbox") 简化为$("<input>", {type: "checkbox"});
谢谢！我不知道这个

【解决方案2】：

好的，简单的方法：

html += "<input type='checkbox' onClick='getPointOnMap(" + obj.lattitude + ", " + obj.longtitude + ")'/>" + obj.address + "<br>";

function getPointOnMap(lat,lng) {
    map.addMarker({
        lat: lat,
        lng: lng,
        click: function(e) {
            alert('You clicked in this marker');
        }
    });
}

【讨论】：

【解决方案3】：

$.ajax({
    type: "POST",
    url: "/getResult.json",
    success: function(result) {
         var myDiv = $('#myDiv');
         $.each(result, function(i, obj) {
             myDiv.append(
                 $('<INPUT>').attr('type', 'checkbox').on('click', function() {
                     getPointOnMap(obj);
                 },
                 obj.address,
                 "<br>"
             );
         });
    }
});

【讨论】：