2017-02-22 8 views
0

ich ein einfaches Drop-Down-Menü habe, die ohne Probleme auf Chrom/firefox funktioniert, funktioniert aber nicht auf Safari - das Menü einfach nicht erscheint eine Schaltfläche klicken:Dropdown-Menü funktioniert nicht auf 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> 

Was kann hier möglicherweise falsch sein?

Antwort

0

role='menu' wird in Safari nicht unter einem ul Element unterstützt.

Sie müssen ein <select> elelem verwenden.

0

Nun ... Sie haben ARIA Funktionen verwendet. Ich habe diese Technologie von Zeit zu Zeit verfolgt, nur aus Interessen heraus. Es muss allerdings angemerkt werden, dass ARIA derzeit nicht so stark unterstützt wird (Februar 2017). Sie können einen schönen Überblick über die Unterstützung des Browsers auf ARIA-Funktionen here haben.

Aber diese Tabelle ist vage und nicht richtig gepflegt. Sie müssen auf jedes Element klicken, um zu sehen, welche Zeile was ist ... Es ist nicht einfach herauszufinden, welcher Browser was unterstützt.

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

Das Problem ist hier role='menu'. Sie müssen zuerst prüfen, ob Opera dies unterstützt. Und wenn ja, könnte es sein, dass sie die Spezifikationen strikter befolgten als andere Browser (wie Firefox). Vielleicht können Sie versuchen, die -role hinzuzufügen, um zu überprüfen, ob das nicht das ist.

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

Wenn es nicht funktioniert, sei es kann dann, dass Safari nicht unterstützt noch. Wenn dies der Fall ist, können Sie stattdessen ein select-Element verwenden.

Verwandte Themen