eneax

12 hours ago, dsonesuk said:

You have a click event within a click event that is only initiated on the parent click event and every click after that? confusing! just imagine how confusing it finds it. Try separating them, the window event should be triggered only if the target event is not equal to toggle event and the paragraph is visible.

thank you for the help, i'm new to javascript, i'm just learning in this site.

Here the code i use to fix the problem:

$(document).ready(function(){
  
    $(".infoBox p").hide();
    
    $(".toggle").click(function(){
        $(".infoBox p").toggle();  
    });
      
    $(window).click(function(e) {
      if (e.target.class != '.toggle' && $(e.target).parents('.toggle').length == 0 && $(".infoBox p").is(":visible") ) {
          $(".infoBox p").hide();
      }
    });
    
});

Hello im doing a simple jquery code for let some element of my page be hide or show on click, here my code:

$(document).ready(function(){
    //hide the box at the start
    $(".infoBox p").hide();
    // open the box when click on class element "toggle"
    $(".toggle").click(function(){
        $(".infoBox p").show(function(){
            //close the box by clicking in every part of the window
            if($(this).is(':visible')) {
                $(window).click(function(){ 
                $(".infoBox p").hide();
                });
            }
        });    
    });
     
});

as you can see i want that my element is hide at start, then when i click on element with class toggle it show me the box and at the end when the box is visible, when i click everywhere in the window the box will close.

Now the first time everything goes as it should, but from the second time when i click on my element "toggle" it does not show my box, i have to do a double click (why?), the hide on window works fine every times, but i can't understand why the second time i have to double click and not a simple click for open my box.

thanks everyone.