如何在$ .get之外引用JSON数据

时间:2013-02-21 11:32:17

标签: jquery json google-maps

我需要在$ .get调用中引用我拥有的JSON数据变量。

我有JSON数据被拉入然后被处理。

我有一些复选框,我想用它来显示和隐藏标记。我有一个显示和隐藏功能,复选框的点击事件 - 位于标记的forloop下方。

我遇到的问题只是第一个复选框显示并隐藏所有标记,所有其他复选框都不执行任何操作。

我确保HTML输出正确,当我在show或hide函数上执行console.log()时,看到正在显示的函数中拉入的值。所以问题似乎与show和hide函数中的forloop有关。 可能没有正确引用数据或位置var。

有关如何正确引用它的任何帮助都会很棒。

// JSON feed
$.get(mapURL + 'map/locations', function(result) {
    var locations = $.parseJSON(result);


    // Markers
    var markers = [];

    // Looping through the JSON data
    for (var i = 0, length = locations.length; i < length; i++) {

        var data = locations[i];

        // Creating a marker and putting it on the map
        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(data.lat, data.long),
            map: map,
            title: data.title,
            icon: iconSrc[data.category]
        });
        markers.push(marker);


    }// END for loop




    /** Shows all markers of a particular category, and ensures the checkbox is checked **/
    function show(category) {
        console.log('show ' + data.category);
        for (var i=0; i<locations.length; i++) {
            if (data.category == category) {
                markers[i].setVisible(true);
            }
        }
    }// END function show



    /** Hides all markers of a particular category, and ensures the checkbox is cleared **/
    function hide(category) {
        console.log('hide ' + data.category);

        for (var i=0; i<locations.length; i++) {
            if (data.category == category) {
              markers[i].setVisible(false);
            }
        }
    }// END function hide


    /** Action when checkbox is clicked **/
    $(".checkbox").click(function(){
        var cat = $(this).attr("value");

        // If checked
        if ( $(this).is(":checked") ){
            show(cat);
        }
        else {
            hide(cat);
        }
    });
});

1 个答案:

答案 0 :(得分:1)

这不是因为您没有在循环中声明data而发生的吗?它应该是

function show(category) {
    console.log('show ' + data.category);
    for (var i=0; i<locations.length; i++) {
        var data = locations[i]; // <---- missing line
        if (data.category == category) {
            markers[i].setVisible(true);
        }
    }
}

(或类似的东西)

您的代码产生了这样的效果,因为data变量“泄漏”了之前的循环。