2011-01-11 7 views
3

Ok, ich habe eine Liste von Radiobuttons in einem DIV, diese DIV gleitet nach unten, wenn ich auf span klicke.Verstecke ein Element, wenn ich außerhalb davon klicke oder woanders auf der Seite

Jetzt, wenn ich einen der Radiobuttons auswähle, wird der Text in der Spanne ersetzt und der DIV wird wieder hochgefahren.

Ich muss auch das DIV mit der Liste der Optionsschaltflächen schieben, wenn der Benutzer irgendwo außerhalb/an einer anderen Stelle auf der Seite klickt.

Hier ist meine jQuery:

$('input[type=radio]').click(function() {  
    $('.selected-search-wjs').text($(this).parent().text());//This replaces the text/selection 
    $('.radio-btns-wrapper-wjs').slideUp('fast');//This makes the DIV slide back up after a selection has been made 
}); 

Jede Idee, wie man das?

Vielen Dank im Voraus.

PS. Lassen Sie mich wissen, wenn Sie HTML benötigen. Ich habe es hier nicht erwähnt, weil ich nicht denke, dass es notwendig ist, da dies ein Verhaltensmerkmal ist, unabhängig davon, wie das HTML zusammengesetzt ist. Vielen Dank.

Antwort

0

Hier ist die Lösung für diese ist.

Alles, was ich brauchte, war zu tun, um die .mouseleave Methode unter Verwendung einer anderen Funktion zu erstellen:

$('.radio-btns-wrapper-wjs').mouseleave(function() { 
    $(this).slideUp(); 
}); 

Nun, ich wurde mit .mouseout aber es hat nicht funktioniert, weil der Behälter DIV hatte Kind-Elemente darin, also sobald du über sie schwebst, würde der DIV wieder nach oben gleiten.

So fand ich diese einfache Erklärung darüber, warum und wie es zu lösen:

http://jquery-howto.blogspot.com/2009/04/problems-with-jquery-mouseover-mouseout.html

Dank.

EDIT--

ich in andere Probleme mit diesem Fall lief, sehen das Problem und Lösung hier: Hide element if displayed (a little complex case)

0

Versuchen jQuery: nicht selecter, wie in

 
$('body:not(.radio-btns-wrapper-wjs, input[type=radio])').click(function() { 
    $('.radio-btns-wrapper-wjs').slideUp('fast'); 
}); 
+0

Nun, keine der Lösungen, die Sie arbeitete zur Verfügung gestellt. Aber sagen wir dann, dass ich die '.radio-btns-wrapper-wjs' nach 3 bis 5 Sekunden, nachdem sie geöffnet wurde, verstecken/rutschen will, benutze dann eine Art Timer? Danke für Ihre Hilfe. –

3

Try this:

var wrapper = $('.radio-btns-wrapper-wjs'); // cache the wrapper element for speed 
$(document).click(function(e) { // when any click is received 
    if (
     (wrapper[0] != e.target) && // the target element is not the wrapper 
     (!wrapper.has(e.target).length) // and the wrapper does not contain the target element 
    ) { 
     wrapper.slideUp('fast'); 
    } 
}); 
+0

Danke für Ihre Antwort einsamer Tag. Bitte lesen Sie meine Antwort in "jqueryrocks" Beitrag. –

+1

Hey, das hat nicht für mich funktioniert. Ich musste (! Wrapper.has (e.target)) zu (! Wrapper.has (e.target) .length) ändern und dann funktionierte es. – Verdagon

+0

@Verdagon Danke: aktualisiert. – lonesomeday

Verwandte Themen