如何獲取選擇字段的值和文本？

Question

我試圖讓選擇字段的值和文本以這種方式出現，但是作爲文本。

'1' => 'Alabama' 
'2' => 'Alaska' 
'3' => 'American Samoa' 
..etc 

但我越來越看起來不正確的結果，這裏是的jsfiddle：http://jsfiddle.net/3UfRq/

JS：

$(document).ready(function() { 
    $("#state").each(function() { 
    $("p#out").text("'" + $(this).val() + "' => '" + $(this).text() + "'<br/>"); 
    }); 
}); 

HTML：

<select id="state"> 
    <option value="1">Alabama</option> 
    <option value="2">Alaska</option> 
    ... 
    <option value="65">Wyoming</option> 
</select> 

輸出：

'43'=>'AlabamaAlaskaAmerican SamoaArizonaArkansas ...懷俄明

Answer 1

你選擇"#state option"比賽只有一個元素，所以each調用你的函數只有一次，這this函數內部是<select>。但是您應該重複執行<option> s。所以，你的代碼應該是這樣的：

$(document).ready(function() { 
    $("#state option").each(function() { 
    $("p#out").append("'" + $(this).val() + "' => '" + $(this).text() + "'<br/>"); 
    }); 
}); 

http://jsfiddle.net/YNGdN/

Answer 2

更換

$("#state") 

隨着

$("#state option") 

代碼

$(document).ready(function() { 
    $("#state option").each(function() { 
    $("p#out").append("'" + $(this).val() + "' => '" + $(this).text() + "'<br/>"); 
    }); 
});​ 

Check Fiddle

Answer 3

你應該遍歷option孩子的，就像這樣：http://jsfiddle.net/xavier_seignard/3UfRq/2/

Answer 4

$('#state option').map(function(i, opption) { 
    $('#out').append(i + ' => ' + option.text + '<br/>'); 
}); 

demo