Kann ich ein Auswahlfeld mit HTML und Javascript proxy?

Question

Da <select> Elemente nicht in einer vorhersehbaren Weise stylen, habe ich darüber nachgedacht, ein JavaScript/HTML-Proxy-Element einzurichten, um ein verstecktes Feld zu bearbeiten <asp:dropdownlist>. Der Code, mit dem die Auswahl gefüllt wird, liegt außerhalb meiner Kontrolle, aber ich möchte das tatsächliche Feld nicht darstellen.

Hat jemand Erfahrung oder Hinweise mit so etwas?

Answer 1

Dies ist ein Job für jQuery. Was Sie tun möchten, ist in etwa die folgenden:

1. Verwenden css die dropdown
2. Lesen Sie die Optionen/Werte des select-Elements in ein JavaScript-Array zu verstecken. jQuery ist gut darin.
3. Verwenden jQuery ein ul-Element mit einem li-Elemente für jede der Optionen
4. Mit den vielen Methoden zu erzeugen, um für das ul-Element in ein Dropdown-Styling

Hier ist ein Beispiel für jemanden, hat dies getan: http://www.brainfault.com/jquery-plugins/jquery-selectbox-replacement/. Sie können seinen Code wahrscheinlich fast so verwenden wie er ist. Das Beispiel ist ein wenig verwirrend, weil er das Dropdown so gestaltet, dass es genau wie ein ausgewähltes Element aussieht. Aber wenn Sie anfangen, das CSS zu bearbeiten, können Sie es so aussehen lassen, wie Sie wollen.