ajax动态添加选择框,的jQuery/AJAX：使用Ajax来填充选择框在一个动态的形式

GroupItemQuantity

1

Dimensioner

Scanner

Scale

Cameras

Computer

Network

Cables

Other

Add Item

JAVA：

$('form').on('click', '.removeVar', function(){

$(this).parent().remove();

});

//add a new node

var varCount = 2;

$('#addVar').on('click', function(){

$node = '

'+varCount+'DimensionerScannerScaleCamerasComputerNetworkCablesOther';

$("#invars").val(varCount);

$('#myTable > tbody:last').append($node);

varCount++;

});

$("select#ctlGroup").change(function() {

$.getJSON("/ajax-select.php",{id: $(this).val(), ajax: 'true'}, function(j){

var options = '';

for (var i = 0; i < j.length; i++) {

options += '' + j[i].title + '';

}

$("select#ctlItem").html(options);

});

});

$("#myTable").on('change', "#ctlGroup", function(){

$.getJSON("/ajax-select.php",{id: $(this).val(), ajax: 'true'}, function(j){

var options = '';

for (var i = 0; i < j.length; i++) {

options += '' + j[i].title + '';

}

$("select#ctlItem").html(options);

});

});

我试图创建一个动态的动态形式选择改变基于第一选择。我的问题是，页面加载时创建的第一行工作正常，但是当我添加第二行，并且我更改该行中的第一个选择时，它会重置第一行中的动态选择。我怎样才能改变JavaScript，所以每一行中的第一个选择只影响同一行中的第二个选择？

谢谢你对此的任何帮助。

+0

你多次使用相同的元素ID，这将无法正常工作(或将不同眉间因为元素ID是整个页面中该元素的**唯一**表示 - 请相应地更改您的代码，然后我们可以帮助您 –