Hiding an element when I click it or somewhere else on the page

Ok, I have a list of radio buttons inside a DIV, this DIV slides down when I click on the span.

Now, when I select one of the radio buttons, the text in the range is replaced and the DIV will shift.

I also need to make a DIV when the switch list is copied, whenever the user clicks somewhere outside / anywhere else on the page.

Here is my 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
});

Any idea how to do this?

Thanks in advance.

PS. Let me know if you need HTML. I did not indicate this here because I do not think it is necessary, since it is a behavior function, no matter how the HTML is combined. Thank.

+3
source share
3 answers

Here is the solution for this.

, , , .mouseleave:

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

.mouseout, , DIV , , , DIV .

, , :

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

.

-

: . : , ( )

0

:

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');
    }
});
+3

jQuery: selecter,

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

Source: https://habr.com/ru/post/1784825/


All Articles