2

我正在尝试突出显示下拉列表的焦点(仅使用键盘选项卡),但由于某种原因,即使它处于焦点,下拉列表也不会突出显示。有人可以帮我解决这个问题吗?

我什至尝试使用下面的 CSS 类,但由于某种原因,焦点不起作用,但悬停工作正常。

CSS:

#selector:focus{ 
      outline: #177f7f dotted medium; 
 }

#selector:hover{ --> works!!!
       outline: #177f7f dotted medium; 
  }

#sortResults:focus{ 
        outline: #177f7f dotted medium; 
 }

HTML 代码:

<div class="selector" id="selector" style="float:right;">
<span style="width: 95px; padding:0 1px; padding:1px;" class="perPageDisplay">20 per page</span>
     <select title="sort results" id="sortResults" name="priceDropDown" class="listSort styled_forms perPageSelector" style="opacity:0; width:140px;">
        <option value="20" selected="selected">20 per page</option>  
        <option value="40">40 per page</option>                                              
        <option value="60">60 per page</option>                                              
        <option value="80">80 per page</option>                                              
        <option value="100">100 per page</option>                                                                        
        <option value="120">120 per page</option>                       
     </select>                          
 </div>
4

2 回答 2

0

首先,确保您发布的代码是正确的。你有opacity:0;哪个没有意义......除此之外,它对我来说很好。我能够切换到下拉列表。这是一个jsfiddle ...

于 2013-09-11T20:30:28.997 回答
0

那是因为 adiv默认情况下是不可聚焦的。tabindex="-1"但是,您可以通过赋予它一个属性来使其具有焦点。有关更长的解释,请参见此答案

于 2013-09-11T20:22:22.153 回答