在单个页面中,我有多个divs
,如下所示:
<div class="map-area">
<img class="icon map_icon" src="..." />
<input type="hidden" class="start_latitude" value="..." />
<input type="hidden" class="start_longitude" value="..." />
<input type="hidden" class="end_latitude" value="..." />
<input type="hidden" class="end_longitude" value="..." /
<div class="google-map"></div>
</div>
点击img
元素后,我运行了一些逻辑并获得了一个google,然后我想将其放入同级google-map
div中,但是它会插入每个div
}与google-map
类。
以下是jQuery:
$('.map_icon').click(function(){
var start_latitude = $(this).siblings( '.start_latitude' ).val();
var start_longitude = $(this).siblings( '.start_longitude' ).val();
var end_latitude = $(this).siblings( '.end_latitude' ).val();
var end_longitude = $(this).siblings( '.end_longitude' ).val();
url = GMaps.staticMapURL({
size: [610, 300],
lat: start_latitude,
lng: start_longitude,
markers: [
{lat: start_latitude, lng: start_longitude, color: 'blue'},
{lat: end_latitude, lng: end_longitude, color: 'red'}
]
});
$('<img/>').attr( 'src', url ).appendTo('.google-map');
});
问题是:如何仅使用班级google-map
附加到兄弟div?
答案 0 :(得分:2)
this
上下文遍历中
获取匹配元素集中每个元素的兄弟元素,可选择通过选择器进行过滤。
$('<img/>').attr( 'src', url ).appendTo($(this).siblings('.google-map'));