bekommen den Wert eines SELECT-Box in Internet Explorer

Question

Ich habe eine Auswahlbox:

<select id="item1" name="Item 1"> 
    <option> </option> 
    <option> Camera </option> 
    <option> Microphone </option> 
    <option> Tripod </option> 
</select> 

Und ich habe das JavaScript:

var item1= document.getElementById("item1").value; 

item1 immer leer zeigt, nie die Option ausgewählt. Dies funktioniert jedoch in firefox.

Answer 1

Die Verwendung von item.value funktioniert für alle Browser außer sehr sehr alten (Netscape 4 jemand?). Der Grund, warum es in diesem Fall nicht funktioniert, ist, dass Sie in den Optionen kein Wertattribut haben. Sie sollten Wert für jedes Attribut deklarieren. Was Sie derzeit haben, ist nur die Eigenschaft "text", die normalerweise auf einen Wert voreingestellt wird, wenn kein Wert angegeben wird. Alternativ können Sie Code in das Fenster onload-Ereignis schieben, um "Wert" jeder dieser Optionen gleich wie "Text" zu machen.

Ein dritte Weg Sie den Code unten verwenden, die auf die altmodische Art und Weise ist:

var s = document.getElementById('item1'); 
var item1 = s.options[s.selectedIndex].value; 

Answer 2

Als Nachtrag # 1, vorsichtig sein, wie < wählen> .selectedIndex kann zu beantworten -1 einig Zeiten, die eine Ausnahme auslösen, wenn sie an < übergeben werden, wählen Sie> .options [n]. Als solche möchten Sie vielleicht einen schnellen Test do tun:

var s = document.getElementById('item1'); 
var item = (-1 != s.selectedIndex)? 
       s.options[s.selectedIndex] : null; 

EDIT

Per Tims Kommentar kann s.selectedIndex -1, wenn Sie es per JavaScript eingestellt oder Sie eine leere < wählen erstellen > Kasten.

Answer 3

Da Ihre Optionsvariablen nicht das Attribut "value" haben, geben IE6 und IE7 eine leere Zeichenfolge zurück. Sie sollten den Wert aus dem Feld „Text“ der Option Objekt wie folgt lauten:

var item1 = s.options[s.selectedIndex].text; 

in item1 Sie den Wert, den Sie benötigen, ohne die Kompatibilität mit Firefox und IE zu brechen 8.

Answer 4

Code ein vaiable column aus der SELECT-Box zu bekommen genannt layerDetails.styleColumn (SELECT-Tag hat denselben Namen und Id), die in allen Browsern funktioniert ...

var columnName = document.getElementsByName('layerDetails.styleColumn')[0].value; 
if (columnName == null || columnName == '') 
    { 
    columnName = document.getElementById('layerDetails.styleColumn').value; 
    } 

if (columnName == null || columnName == '') 
    { 
    var select = document.getElementById('layerDetails.styleColumn'); 
    columnName= select.options[select.selectedIndex].value; 
    if (columnName == null || columnName == '') 
    { 
    columnName= select.options[select.selectedIndex].text; 
    } 
    }