如何将jquery选择器与MVC局部视图一起使用？
如何将jquery选择器与MVC局部视图一起使用？
提问于 2012-06-25 23:05:40
我有一个可变长度的地址模型集合，我想要编辑它。我使用Steve Sandersons方法来编辑这个集合
我通过Ajax添加了一个EditAddress局部视图(RenderPartial)，只需单击一下按钮，就可以很好地工作。
这个局部视图还包含一个google地图“控件”，它可以在地图上指出地址。初始化map需要传入我希望map出现在其中的div元素的id。因此，在部分视图中，我定义了一个id为"# map“的div，并通过jquery将其传递给google map初始化器(脚本驻留在部分视图中)。
现在的问题是，当添加了多个这些部分视图时，页面就会有多个'#map‘div(当我查看源代码时，我看不到通过ajax添加的元素，尽管页面可以很好地呈现它，所以我只是猜测id将是相同的)，如何选择要将jquery连接到的元素的正确id？
如果根本不可能，我还有什么选择呢？
回答 1
Stack Overflow用户
回答已采纳
发布于 2012-06-25 23:17:27
不要使用id选择器，使用其他的东西，比如class选择器。
var map = new google.maps.Map($('.map')[0], myOptions);如果您有多个map选择器，则可以遍历包含它们的列表元素，并分别初始化每个选择器。
$('.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>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/11191908
复制相关文章
相似问题
腾讯云开发者
