Wie schließe ich den Knopf, der offen ist, bevor der nächste in jquery geöffnet wird?

Question

Ich habe zwei divs, die als Tasten arbeiten, aber wenn ich die erste aktiviert habe und ich klicke auf die andere öffnet die erste offene div nicht selbst so überlappen sie müssen Sie manuell schließen, und das ist wirklich unpraktisch. Hier sind die Funktionen:

$(function() { 
    $('#profileButtonImg img').click(function() { 
     $("#myProfileMain").stop(true).fadeToggle(250); 
    }); 
}); 
$(function() { 
    $('#optionsButtonImg').click(function() { 
     $("#myOptionsMain").stop(true).fadeToggle(250); 
    }); 
}); 

Und hier sind die Tasten, die die divs geöffnet werden angeklickt:

<img id="profileButtonImg" src="pic1.jpg" /></div> 
<div id="optionsButtonImg"></div> 

Hier sind die divs, die gemischt werden:

<div id="myProfileMain" style="display:none;"></div> 
<div id="myOptionsMain" style="display:none;"></div> 

Answer 1

Es gibt viele bessere Möglichkeiten, dies unter als meine Antwort zu tun:

$(function() { 
    $('#profileButtonImg').click(function() { 
     $("#myProfileMain").stop(true).fadeToggle(250); 
     $("#myOptionsMain").stop(true).fadeOut(250); 
    }); 
}); 
$(function() { 
    $('#optionsButtonImg').click(function() { 
     $("#myOptionsMain").stop(true).fadeToggle(250); 
     $("#myProfileMain").stop(true).fadeOut(250); 
    }); 
}); 

Answer 2

Ändern Sie diese

('#profileButtonImg img').click(

diese

('#profileButtonImg').click(

Die erste Linie bedeutet, dass der Auslöser ein img innerhalb eines div mit Id profileButtonImg ist. Aber in der Tat selbst das img hat, dass Id