занесения выберите меню с параметрами из массива

Question

У меня возникли проблемы, населяющие мое меню выбора с параметрами из массива, используя этот подход

var adultAgesArr = ['18 - 20', '21 - 30', '31 - 40', '41 - 50', '51 - 60', '60 +']; 
var $ageOptions = ''; 
$.each(adultAgesArr, function(index, value){ 
    $ageOptions += $('<option/>', {text: value}); 
}) 

и после

$('<select/>').append($ageOptions) 

, что я получаю как результат

<select> 
[Object object] [Object object] [Object object] [Object object] [Object object] [Object object] 
</select> 

Answer 1

Вы можете сделать это:

$select = $('select'); 
$.each(adultAgesArr, function(index, value){ 
    $select.append($('<option/>', {text: value, value: value})); 
}) 

Перед тем, как оказалось, что вы принудительно привязываете объекты jQuery к строке. Я так думаю, если вы кэшируете select заранее, так же эффективно.

DEMO

Answer 2

Для создания опции вместо этого делать:

$ageOptions += $("< option/>", {text: value}); 

Лучше сделать это:

new Option("option text", "value") 

затем добавить.

Answer 3

Надеется, что это помогает:

<select id="menu"></select> 

var populate = function() { 
    var adultAgesArr = ['18 - 20', '21 - 30', '31 - 40', '41 - 50', '51 - 60', '60 +'], 
    select = $('#menu')[0]; 

    $.each(adultAgesArr, function(index, value){ 
     var opt = document.createElement('option'); 
     opt.value = value; 
     opt.innerHTML = value; 
     select.appendChild(opt); 
    }); 
} 

populate();