Asp.net mvc 3 jquery选择器如何使用MVC局部视图？

我有一个可变长度的地址模型集合，我想编辑它。我使用这种方法来编辑集合

我通过Ajax添加了一个EditAddress部分视图（RenderPartial），只需点击一个按钮，效果很好

这个局部视图还包含一个谷歌地图“控件”，可以在地图上指出地址。初始化映射需要传入我希望映射出现在其中的div元素的id。因此，在部分视图中，我定义了一个id为“#map”的div，并通过jquery将其传递给GoogleMap初始值设定项（脚本位于部分视图中）

现在的问题是，当添加了多个这些局部视图时，页面将有多个“#map”div（当我查看源代码时，我看不到通过ajax添加的元素，尽管页面呈现得很好，所以我只是猜测id是相同的），如何选择要连接jquery的元素的正确id

---

如果根本不可能，我的选项是什么？

不要使用id选择器，使用其他的，比如类选择器

var map = new google.maps.Map($('.map')[0], myOptions);

如果有多个映射选择器，则可以迭代包含它们的列表元素，并分别初始化每个元素

$('.map-listing-element').each(function(){
    var mapElement = $(this).find('.map-canvas');
    var options = {...};  // whatever the options are
    var googleMap = new google.maps.Map(mapElement[0], options);
});

<div class="this-box-wraps-all-maps">
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map 1
        <div class="map-canvas"></div>
    </div>
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map 2
        <div class="map-canvas"></div>
    </div>
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map 3
        <div class="map-canvas"></div>
    </div>
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map N
        <div class="map-canvas"></div>
    </div>
</div>

$（'.map listing element'）。每个（函数（）{
var mapElement=$（this.find（'.map canvas'）；
var options={…}；//无论选项是什么
var googleMap=new google.maps.Map（mapElement[0]，选项）；
});
…加载包含在此元素中的局部视图
地图1
…加载包含在此元素中的局部视图
地图2
…加载包含在此元素中的局部视图
地图3
…加载包含在此元素中的局部视图
地图

不要使用id选择器，请使用其他工具，如类选择器

var map = new google.maps.Map($('.map')[0], myOptions);

如果有多个映射选择器，则可以迭代包含它们的列表元素，并分别初始化每个元素

$('.map-listing-element').each(function(){
    var mapElement = $(this).find('.map-canvas');
    var options = {...};  // whatever the options are
    var googleMap = new google.maps.Map(mapElement[0], options);
});

<div class="this-box-wraps-all-maps">
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map 1
        <div class="map-canvas"></div>
    </div>
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map 2
        <div class="map-canvas"></div>
    </div>
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map 3
        <div class="map-canvas"></div>
    </div>
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map N
        <div class="map-canvas"></div>
    </div>
</div>

$（'.map listing element'）。每个（函数（）{
var mapElement=$（this.find（'.map canvas'）；
var options={…}；//无论选项是什么
var googleMap=new google.maps.Map（mapElement[0]，选项）；
});
…加载包含在此元素中的局部视图
地图1
…加载包含在此元素中的局部视图
地图2
…加载包含在此元素中的局部视图
地图3
…加载包含在此元素中的局部视图
地图