How to blur <SELECT> in 1 click when click another?

jquery select focus option blur

24,496

The problem is that the first click only closes the select element, it doesn't unfocus it. So to solve you problem, you should catch the close event and then do:

$("select").blur(); // This will even call your event listener!

But how to catch the close event? Unfortunately, there is no such (official) event. But perhaps this question helps: Is there a DOM event that fires when an HTML select element is closed?

24,496

Author by

l2aelba

https://paypal.me/l2aelba

Updated on July 06, 2022

Comments

l2aelba almost 2 years
I can blur <SELECT> when option selected by .change()

But how can I blur <SELECT> when <SELECT> open and click another element or <BODY> ?

Normally we have to click <BODY> 2 times to blur <SELECT> element right ?

How can I do only one click ?
```
$("select").focus(function () {
    $("code").html("focus");
}).blur(function () {
    $("code").html("blur");
});


$("select").change(function(){
    $("select").blur();
});
```
Why I can't do like..
```
$("*:not(select)").click(function(){
    $("select").blur();
});
```
I just only need to detect is <SELECT> open or close

Demo : http://jsbin.com/owitot/1/edit (try to open select box and click body)
- Waleed Khan over 11 years
  
  On my system all you have to do to blur is to click something else, select included. It was my understanding that this behavior was more or less universal.
- Gwyn Howell over 11 years
  
  If you click another element, the select will close and therefore call the blur event. at least, that what happens on my machine. what os, browser etc are you using?
- Anthony Grist over 11 years
  
  @WaleedKhan That's only the case for other input elements, doesn't appear to be the case for elements such as <div>, <body>, etc.
- JJJ over 11 years
  
  The first click closes the option list, the second removes the focus. Why do you want to change the behavior?
- l2aelba over 11 years
  
  Firefox newest (Mac) / tested in all modern browsers , Just still same
- 11684 over 11 years
  
  @WaleedKhan If the select is opened at first you need to click somewhere else than the select element to close it, to unfocus it you need to click a second time.
- l2aelba over 11 years
  
  for open/close <select> detection @Juhana
- l2aelba over 11 years
  
  maybe I have to make my own custom select box :(
- l2aelba over 11 years
  
  Why we can't do like $("*:not(select)").click(function(){$("select").blur();}); ?
- Anthony Grist over 11 years
  
  @l2aelba Might be worth taking a look at this question: stackoverflow.com/questions/1403615/… Not exactly the same, but the basic principle (detecting clicks outside of an element) is going to be the same.
- JJJ over 11 years
  
  Based on this and your previous questions, yes, it would probably be worth it to use a custom select field because you're really trying to twist the default into doing things it just won't do.