Jquery on focus 事件与 html select 标签

我正在使用 jquery 更改下拉菜单的背景。由于某种原因，现在需要单击两次才能选择一个项目，而不是单击一次。

我不知道为什么会发生这种情况，以及有效的解决方法或更好的修复方法。 这似乎发生在 ie7 和 ie 8 中(有一个 friend 在他们的盒子上测试过)下面是我们用来测试这个问题的确切代码。

----------------------------------------完整标记---------------- ----------------

<script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.3.2.min.js" type="text/javascript"></script> 
 
<style type="text/css"> 
    .yellowBackground, .yellowBackground > * > * 
    { 
        background-color: #FFFF79; 
    } 
</style> 
 
<script type="text/javascript"> 
 
    $(document).ready(function() { 
        $('select').focus(function() { 
 
            $(this).addClass('yellowBackground'); 
 
        }) 
    }); 
</script> 
</head> 
<body> 
    <form> 
    <select> 
        <option value="A">Option 1</option> 
        <option value="B">Option 2</option> 
    </select> 
    </form> 
</body> 
</html> 

请您参考如下方法:

这似乎是 known issue in IE7 and forward .

如前所述，一种替代方法是使用 onmousedown 事件来绕过此问题。

    $(document).ready(function() { 
        $('select').mousedown(function() { 
 
            $(this).addClass('yellowBackground'); 
 
        }) 
    }); 

这不适用于通过 Tab 键切换到下拉菜单，尽管 onfocusin 应该也可以工作(但它在 jquery 中不存在)。