[JS]Opera bug? Select box krijgt extra opties bij selecteren - Softwareontwikkeling

maandag 21 augustus 2006 03:34

Acties:

ubi dubium ibi libertas

Topicstarter

Beste WEB'ers (W&G vond ik beter klinken

)

Ik was eens een beetje aan het rommelen met dynamische opties in een selectbox en ik kwam er achter dat bij opera (9.01, build 400, Linux) er lege opties worden toegevoegd.

Hier een stukje voorbeeldcode:

JavaScript:

<html>
    <head>
        <script type="text/javascript">
            function fill(){
                select = 2;
                object = document.getElementById('select');
                data = new Array(1,2,3,4);
                for(i=0; i<data.length; i++){
                    object.options[i] = new Option(data[i], data[i]);
                    if(select == data[i])object.options[i].selected = true;
                }
            }
        </script>
    </head>
    <body onload="fill();">
        <select id="select">
            <option></option>
        </select>
    </body>
</html>

Het probleem doet zich ook voor bij een vriendin van me die ook Opera 9 heeft onder Windows.
Ik zie bij de lijst met opties niet alleen de 4 uit mijn array, maar ook nog 2 lege die eronder staan, terwijl object.options.length gewoon 4 teruggeeft.

Bug of zie ik iets over het hoofd?

Blog [Stackoverflow] [LinkedIn]

maandag 21 augustus 2006 03:50

Acties:

Snake

Los Angeles, CA, USA

Mij lijkt dit een rendering bug in Opera, want bij het bekijken van de generated source krijg ik dit:

HTML:

<HTML><HEAD><SCRIPT type="text/javascript">
            function fill(){
                select = 2;
                object = document.getElementById('select');
                data = new Array(1,2,3,4);
                for(i=0; i<data.length; i++){
                    object.options[i] = new Option(data[i], data[i]);
                    if(select == data[i])object.options[i].selected = true;
                }
            }
        </SCRIPT></HEAD><BODY onload="fill();">
        <SELECT id="select" value=""><OPTION value="1">1</OPTION><OPTION value="2">2</OPTION><OPTION value="3">3</OPTION><OPTION value="4">4</OPTION></SELECT>