Проблема добавления параметров в выпадающий список с помощью jQuery

Question

Я пытаюсь заполнить выпадающий список, когда выбранный элемент списка выбран в другом раскрывающемся списке с помощью jquery, но по какой-то причине параметры создаются за пределами раскрывающегося списка список, вот мой код,

function makeModel(obj){ 
    model = new Array(); 
    model[0] = new Array('212', 'Ace', 'Aceca', 'Cobra', 'Superblower'); 
    model[1] = new Array('145', '146', '147', '147 3 Door', '147 5 Door', '155', '156', '159', '164', '166', '33', '75', '90', 'Alfasud', 'Alfetta', 'Arna', 'Brera', 'GT', 'GTV', 'Giulietta', 'Gold Cloverleaf', 'Mito', 'SZ', 'Spider', 'Sprint'); 
    model[2] = new Array('Rocsta'); 

    var curSel=obj.options[obj.selectedIndex].value ; 
    var x; 

    $('#replace').html("<select name=\"test\" id=\"test\">"); 
    for (x in model[curSel]) 
    { 
     $('#replace').append("<option>" + model[curSel][x] + "</option>"); 
    } 
    $('#replace').append("</select>"); 

} 

HTML-:

<form> 
<fieldset>  
    <p> 
     <label for="test">Make: </label> 
     <select name="test" id="test" onchange="makeModel(this);"> 
     <option>Select one</option> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
     </select> 
    </p> 
</fieldset> 
</form> 

<div id="replace"></div> 

Я уверен, что это логическая ошибка где-то с моей стороны, но я не могу найти его!

Так что любая помощь будет оценена, спасибо!

Answer 1

Вы добавляете к элементу замены div, а не к элементу ввода select.

Изменить то, что вы добавление к (вместо #replace, вы будете использовать #test) однако идентификатор #test используются для ОБА избранных вставляются в область замены и первичный выбор ввод, используемый для выполнения вставки. Так что вам нужно изменить что-то вроде «суб», и вы в конечном итоге с чем-то вроде этого:

function makeModel(obj){ 
    model = new Array(); 
    model[0] = new Array('212', 'Ace', 'Aceca', 'Cobra', 'Superblower'); 
    model[1] = new Array('145', '146', '147', '147 3 Door', '147 5 Door', '155', '156', '159', '164', '166', '33', '75', '90', 'Alfasud', 'Alfetta', 'Arna', 'Brera', 'GT', 'GTV', 'Giulietta', 'Gold Cloverleaf', 'Mito', 'SZ', 'Spider', 'Sprint'); 
    model[2] = new Array('Rocsta'); 

    var curSel=obj.options[obj.selectedIndex].value ; 
    var x; 

    $('#replace').html("<select name=\"test\" id=\"sub\">"); 
    for (x in model[curSel]) 
    { 
     $('#sub').append("<option>" + model[curSel][x] + "</option>"); 
    } 

} 

Это будет делать трюк. See here.

Answer 2

$('#replace').append("</select>"); 

Не нужно. И фактически создаст другой элемент выбора или просто ошибку.

В вашем вопросе вы добавляете параметры в div, а не на самом деле. Я бы это исправил.

function makeModel(obj){ 
    model = new Array(); 
    model[0] = new Array('212', 'Ace', 'Aceca', 'Cobra', 'Superblower'); 
    model[1] = new Array('145', '146', '147', '147 3 Door', '147 5 Door', '155', '156', '159', '164', '166', '33', '75', '90', 'Alfasud', 'Alfetta', 'Arna', 'Brera', 'GT', 'GTV', 'Giulietta', 'Gold Cloverleaf', 'Mito', 'SZ', 'Spider', 'Sprint'); 
    model[2] = new Array('Rocsta'); 

    var curSel=obj.options[obj.selectedIndex].value ; 
    var x; 

    var $replace = $('#replace'); 
    var $sel = $('<select name="test" id="sub">').appendTo($replace); 
    $.each(model[curSel], function(i,v){ 
    { 
     var $option = $("<option>" + v + "</option>"); 
     $sel.append($option); 
    }) 
} 

Использование JQuery каждый лучше вообще вместо for in, как если бы прототипы были продлены вы можете подобрать много мусора, что бы вы не ожидали!