How to close an element by clicking out of it?

Question

I need to make element close by clicking out of it and few other elements. Which solution is the best for performance? Onblur doesn't work.

Answer 1

Can you create an "onmouseout" event that triggers when the cursor leaves the dropdown option?

Answer 2

window.onclick = ()=>{
//close elements code
}

You can do this classic method too

Answer 3

Sona Sarkisian So I've made the following code to demonstrate how blur should work. Click on left input box then on right. Left loses focus and triggers text to appear.

Maybe there's something else wrong. Can you share your code?

https://code.sololearn.com/WZ7W1i4m9r3c/?ref=app

Answer 4

Thank you very much, it worked for me.

P.S. I'll add a code later for everyone, who needs an answer too.

Answer 5

Have you tried onfocusout?

Answer 6

Thank you for the answers, but still both ones didn't worked.

Answer 7

Thank you for a good example.

My problem is that I've made a custom dropdown from the select element's options. And I've made a searching functionality this way: when users open a dropdown an outside hidden input gets a focus, so everything they write "appears" in this input and I can take a value to search.

There is also an option to use $("*:not(.dropdown)").click(), but it will work for each click on the page and it's not the best practice for performance.