Warum wird meine benutzerdefinierte Klasse nicht auf body angewendet, wenn sie über jQuery mit gmap -Ereignis-Klick-Listener hinzugefügt wird?

Question

Ich möchte ein Dia-Menü öffnen, wenn ich auf einen gmap-Marker klicke, aber ich kann nicht. Hier ist, wie ich vorgegangen, dass zu erreichen:

google.maps.event.addListener(marker, 'click', function() { 
    $('body').toggleClass("side-panel-open"); 
    if($('body').hasClass('device-touch')) { 
     $('body').toggleClass("ohidden"); 
    } 
    return false; 
}); 

Das gleiche funktioniert auch mit einer normalen Taste, wenn ich es schaffe, dass auf diese Weise:

$("#test").click(function(){ 
    $('body').toggleClass("side-panel-open"); 
    if($('body').hasClass('device-touch')) { 
     $('body').toggleClass("ohidden"); 
    } 
    return false; 
}); 

Wie Sie es sehen:

http://www.themes.krown.ch/canvas4/HTML/index-fullscreen-image_test.html

Die Schaltfläche "TEST" auf der Fußzeile funktioniert einwandfrei. Beim Klicken auf den gmap-Marker passiert leider nichts. Ich kann auf Firebug sehen, dass etwas am Körper passiert, aber die Klasse "Side-Panel-Open" bleibt nicht.

Ich habe auch versucht, nur eine Klasse an den Körper hinzufügen, auf diese Weise:

$('body').addClass('side-panel-open'); 

Es geschieht nichts, als mit dem ersten Code. Das ist so seltsam, weil ich versuche, eine andere Klasse hinzuzufügen, zum Beispiel "class_name".

$('body').addClass('class_name'); 

Dokumentation: Diese Klasse wird auf den Körper wie erwartet angewendet werden https://developers.google.com/maps/documentation/javascript/examples/event-simple

Answer 1

Für die Taste können Sie die jQuery click event verwenden oder wenn Sie einen anderen JavaScript-Framework verwenden, werden sie wahrscheinlich habe auch ein Klick-Event. Für jQuery, würden Sie wie folgt vor:

$('#boundaries-states').click(function() { 
//Do something 
}); 

Es ist wie die addListener Methode sieht Gegenstand der Google Map nimmt, nicht das HTML-Element für die Karte. Sehen Sie sich das erste Beispiel hier an. Programme, die an bestimmten Ereignissen interessiert sind, registrieren JavaScript-Ereignis-Listener für diese Ereignisse und führen Code aus, wenn diese Ereignisse empfangen werden, indem sie addListener() aufrufen, um Ereignishandler für das Objekt zu registrieren.

Also, wenn Sie nicht bereits sind, werden Sie müssen auf den Verweis auf Ihre Karte halten, die zurückgegeben wird, wenn Sie die Karte instanziiert:

var map = new google.maps.Map(document.getElementById('boundaries-states'), 
mapOptions); 
Once you have your map reference, you can add a listener using the map object, rather than the HTML element. 

google.maps.event.addListener(map, 'click', function() { 
alert('clicked'); 
});