下拉菜单无法在Safari

问题描述：

工作，我有一个在Chrome/Firefox中工作没有任何问题，一个简单的下拉菜单，但在Safari浏览器不工作 - 菜单只是不会出现在点击一个按钮：下拉菜单无法在Safari

<div> 
    <a id='action-btn-1' href='#' data-toggle='dropdown' class='btn btn-default btn-xs edit' aria-haspopup='true' aria-expanded='false' role='button'> 
     <span class="caret"></span> 
    </a> 
    <ul class='dropdown-menu text-left' role='menu' aria-labelledby='dLabel'> 
     <li>aaa</li> 
     <li>bbb</li> 
    </ul> 
</div>

这里可能有什么错误？

答

role='menu'在Safari中不支持ul元素。您需要使用<select> elelemt。

答

那么...你一直在使用ARIA的功能。我一直在追踪这项技术，只是出于兴趣。尽管必须指出，ARIA目前并没有得到如此广泛的支持（2017年2月）。您可以对浏览器对ARIA功能here的支持有一个很好的概述。

但该表格含糊不清并且没有得到适当的维护。你必须点击每个元素来查看哪一行是什么......要找出哪个浏览器支持什么并不容易。

<ul class='dropdown-menu text-left' role='menu' aria-labelledby='dLabel'> 
    <li>aaa</li> 
    <li>bbb</li> 
</ul>

这里的问题是role='menu'。如果Opera支持，你必须首先检查。如果是这样，那可能是他们比其他浏览器（比如Firefox）更严格地遵循规范。也许你可以尝试添加menuitem -role来验证是否不是。

<ul class='dropdown-menu text-left' role='menu' aria-labelledby='dLabel'> 
    <li role="menuitem">aaa</li> 
    <li role="menuitem">bbb</li> 
</ul>

如果它不工作，那么这可能是因为Safari浏览器不支持它尚未。如果出现这种情况，您可以考虑改用select元素。

下拉菜单无法在Safari

相关推荐