<select> visualizzare il valore al posto del testo

[SoloWiFi]

Ho bisogno di fare questa cosa, mi sembra che si possa fare ma non ricordo e non trovo suggerimenti.

Ho una select tipo questa:

<select id="MiaSelect">
      <option value="A">Arancia</option>
      <option value="B">Banana</option>
      <option value="C">Ciliegia</option>
</select>

- Nella tendina vedo tutte e tre le opzioni con i rispettivi testi (Arancia, Banana, Ciliegia)
- Se seleziono Banana visualizzo (a tendina chiusa) il testo "Banana"
- La select ha preso come valore B

Fino qui tutto regolare

Io invece voglio che:
- All'apertura della tendina visualizzo sempre i testi (Arancia, Banana, Ciliegia)
- Alla selezione (tendina chiusa) visualizzo B che è il valore della selezione effettuata
- Il valore della select rimanga B

In pratica vorrei vedere il valore invece che il testo ma solo a tendina chiusa.

E' possibile?

[Flaviors200]

Non ho capito bene la tua richiesta e anche rileggendola mi sembra alquanto astrusa

Provo a risponderti lo stesso, se vuoi che il valore mostrato all'utente dopo la selezione sia il contenuto dell'attributo value, devi usare javascript oppure JQuery.

In javascript

<select id="MiaSelect" onchange="javascript:this.options[this.selectedIndex].innerHTML=this.value;">
    <option value="A">Arancia</option>
    <option value="B">Banana</option>
    <option value="C">Ciliegia</option>
</select>

In JQuery segui questa risorsa

[SoloWiFi]

Perfetto! Devo manipolare il innerHTML della select

Per tua curiosità:
Mi serve per guadagnare spazio sui display mobile.

Ora però mi nasce il problema nel caricamento della select per avere lo stesso effetto. Non è supportato l'evento onload.

Avrò una lista lunga <N> record e ad ognuna riga ho una select che ha un preciso ID
Non posso usarle l'onload in body. E' tutto in un DIV che varia il contenuto in modo asincrono.

[SoloWiFi]

---------------
OK - Risolto.
Uso l'OnLoad di una immagine che è al fianco della select.

[Shores]

Oppure puoi semplicemente rendere la select più stretta, in modo che nella pagina si veda solo il primo carattere: quando su smartphone si tocca per scegliere si vedono sempre le option intere...