option.style.display = "none" nie pracuje w safari

Question

To jest przykład pracuję nad: http://jsfiddle.net/4suwY/5/

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"; 

Jak widać, działa w chrome, ale nie działa na safari. Co należy zrobić, to ukryć opcję "I 'THE THE CHOSEN ONE" po kliknięciu menu rozwijanego ..

Jest to kolejny test zrobiłem: http://jsfiddle.net/4suwY/11/

sam kod HTML, to 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"; 

W każdym razie, co muszę zrobić, to wyświetlić opcję jako wybrany (prąd) i schować do użytkownik po otwarciu menu rozwijanego, więc nie może go wybrać.

Wszelkie sugestie/obejście problemu? Nie widzę żadnego błędu. Co jest nie tak z Safari? Czy powinienem zmienić podejście? Jquery wydaje się nie pomagać.

---

redaguje:

muszę ukryć opcje w DropDownMenu, ale jednocześnie muszę pokazać opcję „wartości” jako wybranej wartości! Na przykład menu "zamknięte" wyświetli wartość "JESTEM WYBRANYM", ale jeśli kliknę i otworzę menu, jedynymi widocznymi opcjami będą "cześć, asd, wer, qwe" ..

Answer 1

Nie można przełączać wyświetlania elementów <option> w Safari (lub IE, w tym przypadku). Jest to część długiej i niekonsekwentnej tradycji, ponieważ Safari ogranicza funkcjonalność stylów CSS na elementach formularzy, uważając, że język wizualny elementów interaktywnych powinien być spójny z systemem operacyjnym (nie ma sensu próbować znaleźć uzasadnienia dla błędów IE).

Jedynymi opcjami są: usunięcie (i ponowne dołączenie później) lub ustawienie na optnz.disabled = true. Przykro mi z powodu złych wieści!