Close element when clicking any other part of the page

Question

Close element when clicking any other part of the page

Navigation

#1 by (1 votes)

0

When the event is triggered, the element opens, but after that it does not close. How can I do that by clicking outside the "infoValue" tooltipValor close?

function formTips(){
    var infoValor=document.getElementById("info-input-valor");
    var tooltipValor=document.getElementById("tooltip-input-valor");
    infoValor.onclick=function(){
        if(tooltipValor.style.display!="block"){
            tooltipValor.style.display="block";
        }else{
            tooltipValor.style.display="none";
        }
    }
}formTips();

javascript eventos

asked by anonymous 28.03.2017 / 15:33

1 answer

Data modeling with people of different profiles Confusing code - what is the meaning?

score 1 · Accepted Answer

This could be done easily with the ToolTip of jQuery , but as you are doing in Javascript pure, you will have to capture the click event of the document. Then check if you clicked on any element outside your tooltip, and then hide the element. You can do this like this:

document.onclick = function(e){
    if(e.target.id != 'info-input-valor'){
        var tooltipValor=document.getElementById("tooltip-input-valor");
        tooltipValor.style.display="none";
    }
};

If you want you can also change the code you have already done, and in the same function , see if the element id is your tooltip and display.