Espacios en blanco en las opciones de un select

[waspeis]

Buenas compañeros,

Necesito agregar una serie de elementos a un select pero no consigo que me respete los espacios en blanco. Pondré un ejemplo:

La aplicación tiene un input type text y al pulsar la tecla intro se introduce el valor escrito en otro input type text. Para simplificar, en este ejemplo la función enter() introducirá el valor "hola espacio espacio espacio espacio espacio espacio espacio espacio espacio que hay".

Código Javascript:

<script>
    function enter()
    {
        if(event.keyCode==13)
        {
            var cad = "hola         que hay";
            var option = document.createElement("option");
            option.text = cad;
            conceptos.add(option);
        }
    }
</script>
 

Código PHP:

echo "<input type=text name=total id=total onkeypress=enter() size=2>";
echo "<select name=conceptos id=conceptos onchange=mostrar() size=10 style='width:350'></select>";
 

El resultado en Google Chrome es "hola que hay" dentro del select, sin respetar los espacios

El resultado en Internet Explorer es "hola espacio espacio espacio espacio espacio espacio espacio espacio espacio que hay" dentro del select, pero no me funciona correctamente. No me funciona porque luego, al pulsar sobre un elemento del select, tengo que mostrar las letras una a una y al mostrar las letras mediante la función alert() me da como resultado undefined.

Esta es la función que muestra las letras:

Código Javascript:

function mostrar()
    {
        alert(conceptos.options[conceptos.selectedIndex].text);
        alert(conceptos.options[conceptos.selectedIndex].text.length);
        for(var i=0;i<10;i++) 
            alert(conceptos.options[conceptos.selectedIndex].text[i]);
    }
 

La primera línea me muestra el texto completo correctamente. La segunda el tamaño del texto. Y cuando empieza el for sólo muestra undefined y además sólo lo muestra 5 veces...

[ocp001a]

Sobre los espacios en blanco en un select, dependerá del navegador si muestra o no dichos espacios. Para cuestiones de estética es posible forzar dichos espacios con  

Respecto a la segunda función con los alert, seguramente te está ignorando los espacios, en vez de recorrer el text recorre el value
alert(conceptos.options[conceptos.selectedIndex].value[i]);

[waspeis]

Ya probé con  

Si pongo:

Código Javascript:

var cad = "hola      que hay";
 

El resultado es hola      que hay

Respecto a la función alert(), al recorrer con el text o con el value el resultado es el mismo. Internet Explorer me muestra undefined. En cambio Google Chrome me muestra los caracteres uno a uno correctamente.