There seems to be an issue with binding jQuery events to a select element. The desired behavior is for the .focus class to be added when the select is clicked. However, the logic breaks when an option is selected from the dropdown.
See it in action here: JSFIDDLE
Follow these steps:
- Click on the select
- Select an option
- Click on the select again -
.focusnot added
Here's the code snippet:
<a>
<select>
<option>A</option>
<option>B</option>
<option>C</option>
</select>
</a>
$('select').focusin(function(){
$(this).parent('a').addClass('focus');
});
$('select').bind('focusout change',function(){
$(this).parent('a').removeClass('focus');
});