如何使用MVC部分視圖的jQuery選擇器？

Question

我有一個可變長度的地址模型集合，我想編輯。我用Steve Sandersons的方法來編輯集合

我添加一個EditAddress局部視圖（RenderPartial）通過Ajax在一個按鈕單擊工作正常。

此部分視圖還包含一個谷歌地圖「控制」，它允許指出地圖上的地址。初始化地圖需要傳入我希望地圖出現在div元素的ID。因此，在部分視圖中，我定義了一個ID爲「#map」的div，並通過jquery將其傳遞給Google地圖初始化程序（腳本駐留在局部視圖中）。

現在的問題是，當有多個這些部分視圖添加會有多個'#map'divs的頁面（當我查看源代碼時，我沒有看到通過ajax添加的元素，雖然頁面呈現它很好我只是猜測，ID將是相同的），如何選擇一個元素的正確的ID掛鉤jquery？

如果它根本不可能，我的選擇是什麼？

Answer 1

不要使用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>