2013-02-22 14 views
7

Dies ist das Beispiel arbeite ich an: http://jsfiddle.net/4suwY/5/option.style.display = "none" nicht in Safari arbeiten

HTML:

<select id="asd"> 
    <option>hello</option> 
    <option>I'M THE CHOSEN ONE</option> 
    <option>asd</option> 
    <option>wer</option> 
    <option>qwe</option> 
</select> 

JS:

var sel = document.getElementById("asd"); 
var optnz = sel.getElementsByTagName("option")[1]; 
sel.value = optnz.value; 
optnz.style.display = "none"; 

Wie Sie können sehen, es funktioniert in Chrom, aber es funktioniert nicht in Safari .. Was es tun soll, ist die ausblenden "Ich bin die gewählte" Option, wenn Sie auf das Dropdown-Menü klicken.

Dies ist ein weiterer Test, den ich gemacht: http://jsfiddle.net/4suwY/11/

Same HTML, das ist die JS:

var sel = document.getElementById("asd"); 
var opt = document.createElement("option"); 
opt.innerHTML = "YAYA"; 
opt.value = "YAYA"; 
sel.appendChild(opt); 
sel.value = "YAYA"; 
opt.style.display = "none"; 

Wie auch immer, was ich brauche, ist eine Option zu tun angezeigt als (aktuelle) ausgewählt, und verstecken die Benutzer, wenn das Dropdown-Menü geöffnet ist, so kann er es nicht wählen.

Jeder Vorschlag/Workaround? Ich sehe keinen Fehler. Was ist los mit Safari? Soll ich den Ansatz ändern? Jquery scheint nicht zu helfen.


EDITS:

Ich brauche die Optionen im Dropdownmenü, aber zur gleichen Zeit ich diese Option „Wert“ als der gewählten Wert zeigen, müssen zu verstecken! Zum Beispiel zeigt die "geschlossene" Dropdown-Liste den Wert "Ich bin der Auserwählte", aber wenn ich klicke und das Menü öffne, sind die einzigen sichtbaren Optionen "Hallo, asd, wer, qwe" ..

Antwort

19

Sie können die Anzeige nicht auf <option> Elemente in Safari (oder IE, für diese Angelegenheit) umschalten. Dies ist Teil einer langen und inkonsistenten Tradition, bei der Safari die CSS-Stilfunktionalität auf Formularelementen einschränkt, da die visuelle Sprache interaktiver Elemente mit dem Betriebssystem konsistent sein sollte (kein Versuch, eine Begründung für die Fehler des IE zu finden).

Sie haben nur die Wahl, sie entweder zu entfernen (und später erneut anzufügen) oder auf optnz.disabled = true zu setzen. Sorry für die schlechten Nachrichten!

+1

Das rettete meinen Tag –

+0

Oder verwenden Sie 'Sichtbarkeit: versteckt' – JDrake

Verwandte Themen