Eine Aktion vor einer anderen in einer Jquery-Funktion

Question

Ich möchte, dass, wenn ich auf "nav-toggle" klicke, die Umschaltklasse "open" zu "grappa" hinzufügt. Dann möchte ich die Toggle-Klasse "open" entfernen und auf eine beliebige Stelle auf der Webseite klicken.

Ich schrieb dies, aber es funktioniert nicht.

$(function() { 
     $('.nav-toggle').on('click', function(){ 
      $('.grappa').toggleClass('open');{ 
       $(document).click(function() { 
       $('.grappa').toggleClass('close'); 
      }); 
      } 
     }); 

    }); 

Answer 1

schreiben separate Ereignisse

Um

Toggle

$('.nav-toggle').on('click', function(){ 
     $('.grappa').toggleClass('open'); 
    }); 

Irgendwo auf Web-Seite klicken

$(document.body).click(function() { 
    $('.grappa').toggleClass('close'); 
}); 

wachet/Console-Anweisungen an das Skript wird immer called.Referencing js in Ihrer Webseite sollte korrekt sein

an diesem Fiddle

Blick aktualisiert http://jsfiddle.net/M4teA/

Answer 2

Sie können überprüfen, ob Ihr grappa Element hat die open Klasse vor der close Klasse Makeln. Dann würde die Klasse close nur umgeschaltet werden, wenn open bereits umgeschaltet wurde. Etwas wie:

$(function() { 
    $('.nav-toggle').on('click', function(){ 
     $('.grappa').toggleClass('open'); 
    }); 

    $(document).click(function() { 
     if ($('.grappa').hasClass('open')) 
     { 
      $('.grappa').toggleClass('close'); 
     } 
    }); 

}); 

Auch da habe ich keine Ihrer CSS oder HTML gesehen Ich bin mir nicht ganz sicher, wie Sie die open und close Klassen verwenden, aber es scheint, dass es vielleicht mehr Sinn machen, nur Fügen Sie die Klasse open hinzu und entfernen Sie sie, je nachdem, ob das Element diese Klasse enthält. Etwas wie:

$(document).click(function() { 
    if ($('.grappa').hasClass('open')) 
    { 
      $('.grappa').removeClass('open'); 
    } 
});