2013-10-25 4 views
0

Я пытаюсь открыть окно с помощью кнопки, расположенной в другой инфоиндустрии.Как открыть окно с помощью кнопки

Я сделал кнопку, но мне нужна помощь по созданию триггера или события для этого.

Кнопка:

<input name="enviar" type="submit" id="form1" value="Reservar"/> 

Код для открытия InfoWindow, нажав на маркер, мне нужно, чтобы открыть, нажав на кнопку. Пожалуйста помоги.

var form = new google.maps.Marker({ 
    map: map, 
    position: myLatLng, 
    draggable: true, 
    icon: icon 
}); 

google.maps.event.addListener(form, 'click', showform); 
infoWindow = new google.maps.InfoWindow(); 

function showform(event) { 
    var contentString = '<div style="width:160px;height:140px;"> <b>LOTE 1</b> <img src="img/terreno1.png" width="113" height="72" /> <br>450m²<br> <p style="color:#F00;"> Indisponível </p></div>'; 

    infoWindow.setContent(contentString); 
    infoWindow.setPosition(event.latLng); 
    infoWindow.open(map); 
} 

ответ

0

Я положил demo with solution на JSFiddle

Вот HTML часть

<div id="map-canvas" style="width:100%;height:800px;"></div> 

JavaScript

var infoWindow; 
$(document).ready(function(){ 
    var default_center = new google.maps.LatLng(-34.397, 150.644); 
    var mapOptions = { zoom: 8, center: default_center, mapTypeId: google.maps.MapTypeId.ROADMAP }; 
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
    infoWindow = new google.maps.InfoWindow(); 

    var marker1 = new google.maps.Marker({ position: default_center, map: map }); 
    marker1.content = '<input name="enviar" type="submit" id="form1" value="Reservar"/>'; 
    google.maps.event.addListener(marker1, 'click', function() { 
    showform(marker1, function(){ 
     $("#form1").click(function(){ 
     showform(marker2); 
     }); 
    }); 
    }); 

    var marker2 = new google.maps.Marker({ position: new google.maps.LatLng(-34.297, 150.144), map: map }); 
    marker2.content = '<div style="width:160px;height:140px;"> <b>LOTE 1</b> <img src="img/terreno1.png" width="113" height="72" /> <br>450m²<br> <p style="color:#F00;"> Indisponível </p></div>'; 
    google.maps.event.addListener(marker2, 'click', function() { 
    showform(marker2); 
    }); 
}); 

function showform(marker, handler) { 
    if(infoWindow) infoWindow.close(); 
    infoWindow.setContent(marker.content); 
    infoWindow.setPosition(marker.getPosition()); 
    infoWindow.open(map); 
    if(handler){ 
    google.maps.event.addListener(infoWindow, 'domready', handler); 
    } 
} 
Смежные вопросы