重点打开一个html选择选项 [英] Opening a html select option on focus

问题描述

我曾问过一个关于如何在onfocus（）上打开HTML选择标记的选项列表。当时它解决了我的问题，但我错过了每次打开html选择选项 onfocus 下一个选择选项都消失的问题。

I had asked a question about How to open option list of HTML select tag on onfocus(). At that time it solved my problem but I missed one problem that every time on opening a html select option onfocus next select option went disappear.

我无法找到这段代码出了什么问题。
这里是该问题链接 jsFiddle 。

I not able to find whats going wrong with this code. here is link for that problematic question jsFiddle.

推荐答案

是的，这就是行

Yes, that's what the lines

var x = "select[tabindex='" + (parseInt($(this).attr('tabindex'),10) + 1) + "']";
$(x).fadeTo(50,0);

。他们隐藏下一个选择，因为否则它会显示在扩展的顶部。

do. They hide the next select, because otherwise it would show on top of the expanded one.

尽管如此，这并不是一个好的解决方案。相反，我会使用z-index来防止发生这种情况：

This isn't a good solution at all though. Instead i'd use z-index to prevent that from happening:

$('select').focus(function(){
    $(this).attr("size",$(this).attr("expandto")).css('z-index',2);        
});
$('select').blur(function(){
    $(this).attr("size",1).css('z-index','1');         
});
$('select').change(function(){
    $(this).attr("size",1).css('z-index','1');
}); 

使用类而不是内联样式会更好。但我只是作为示范使用。

It would be even better to use a class instead of inline style. But i used that just as a demonstration.

http： //jsfiddle.net/PpTeF/1/

这篇关于重点打开一个html选择选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！