0

让我澄清一下。

我有一个巨大的循环来解析 XML，相应地在谷歌地图上放置标记，并制作隐藏的 div，每个标记一个，其中包含与该标记相关的信息。

该循环还在每个标记上放置一个打开信息窗口的事件。信息窗口包含一个按钮，该按钮必须显示该特定标记的 div。

但我不确定如何做到这一点。这是下面的大部分代码——我省略了循环中不相关的早期部分，并专注于我试图将点击事件附加到每个新按钮的区域。

但我不确定如何做到这一点。请参阅代码中的注释以获得完整的理解。

$(xml).find('sample').each(function () {

    var id = $(this).find('id long').text();

    /*there was code here which creates the other variables you see below*/

    var infoPage = '<div style="display:none; position:absolute; top:0px; bottom:0px; width:100%;" id="' + id + 'Info">' + '<p>Number: ' + number + '</p>' + '<p>ID: ' + id + '</p>' + '<p>Rock type: ' + rockType + '</p>' + '<p>Minerals: ' + minerals + '</p>' + '<p>Regions: ' + regions + '</p>' + '<p>Latitude: ' + latitude + '</p>' + '<p>Longitude: ' + longitude + '</p>' + '</div>';

    //there was code here which inserts this div into the page

    //this line creates the button which appears inside the info window
    var contentString = '<a href="" data-role="button" id="' + id + '">' + number + '</a>';

    //this line creates the info window
    var infowindow = new google.maps.InfoWindow({
        content: contentString
    });

    /*Here is where I hit a problem. I now need to construct a line of jQuery which attaches to this particular button a click event. But it needs to do it for every new button in the loop, so that each button's click event is unique and opens its personal div. How do I construct a selector which will change with the loop to accomplish the desired result?*/
    $('#' + id).click(function () {
        $('#' + id + 'Info').show();
    });

    google.maps.event.addListener(marker, 'click', function () {
        infowindow.open(map, marker);
    });

});
4

1 回答 1

1

首先，为所有按钮赋予相同的类

var contentString = '<a href="" class="mybutton" data-role="button" id="' + id + '">' + number + '</a>';

其次，将事件处理程序绑定到所有mybuttons

$(document).on('click', '.mybutton', function() {
    $('#' + $(this).attr('id') + 'Info').show();
});

UPD：正如@Felix Kling 所说-这里重要的是您需要在循环外绑定一次

于 2012-05-28T02:15:35.957 回答