【发布时间】：2014-08-15 19:54:33
【问题描述】：
专家！我对两个动态下拉菜单有一些问题。这是我的小提琴：
这是我的 jQuery 和 Javascript：
var num_rows = 1;
var num_tests = 1;
var myArray = new Array();
function firstSelection(id) {
var index = id.replace( /\D+/g, '');
var item = $("#select" + index + "").val();
var object = item.replace(/\d/g, "");
var table = $("#test");
if(object == 'analize') {
table.find('tr').each(function(i) {
$("#selectTest" + i + "").empty();
$("#selectTest" + i + "").append("<option value=''/><option value='analizetest1'>AnalizeTest1</option><option value='analizetest2'>AnalizeTest2</option><option value='analizetest3'>AnalizeTest3</option>");
});
}
else if(object == 'create') {
table.find('tr').each(function(i) {
$("#selectTest" + i + "").empty();
$("#selectTest" + i + "").append("<option value=''/><option value='createtest1'>CreateTest1</option><option value='createtest2'>CreateTest2</option>");
});
}
else if(object == 'draft') {
table.find('tr').each(function(i) {
$("#selectTest" + i + "").empty();
$("#selectTest" + i + "").append("<option value=''/><option value='drafttest1'>DraftTest1</option><option value='drafttest2'>DraftTest2</option><option value='drafttest3'>DraftTest3</option>");
});
}
else {
table.find('tr').each(function(i) {
$("#selectTest" + i + "").empty();
});
}
}
$(document).ready(function() {
$("#addObjekt").click(function() {
num_rows = $("#objectTable tr").length;
$("#objectTable").append("<tr id='objectRow" + num_rows + "'><td><input class='text' type='text' id='pbz" + num_rows + "' name='pbz" + num_rows + "' value='" + num_rows + "' readonly/></td><td><select id='select" + num_rows + "'><option/><option value='analize" + num_rows + "'>Analize</option><option value='create" + num_rows + "'>Create</option><option value='draft" + num_rows + "'>Draft</option></select></td><td><button type='button' id='selectButton" + num_rows + "' onclick='firstSelection(id);'>Select</button></td><td><button type='button' id='copy" + num_rows + "'>Copy</button></td></tr>");
});
$("#deleteObjekt").click(function() {
var row = $("#objectTable tr").length - 1;
if(row > 1) {
$("#objectRow" + row + "").remove();
return false;
}
else {
// do nothing
}
});
$("#addTest").click(function() {
num_tests = $("#test tr").length;
$("#test").append("<tr id='testRow" + num_tests + "'><td><input class='text' type='text' id='zaehler" + num_tests + "' name='zaehler" + num_tests + "' value='" + num_rows + "-" + num_tests + "' readonly/></td><td><select id='selectTest" + num_tests + "'></select></td><td><button type='button' id='parameter" + num_tests + "'>Parameter</button></td><td></td><td></td></tr>");
});
$("#deleteTest").click(function() {
var test_row = $("#test tr").length - 1;
if(test_row > 1) {
$("#testRow" + test_row + "").remove();
return false;
}
else {
// do nothing
}
});
});
function showMatrix() {
num_rows = $("#objectTable tr").length - 1;
num_tests = $("#test tr").length;
for(var x = 0; x < num_rows; x++) {
myArray[x] = new Array();
myArray[x] = $("#select" + (x + 1) + "").val();
for(var z = 0; z < num_tests; z++) {
myArray[x][z] = firstSelection.item + firstSelection.index;
}
}
alert(myArray);
}
问题是：
- 第二个下拉列表尚未根据第一个下拉列表的选择进行填充。由于某种原因，它在小提琴中无法正常工作，但在我使用的环境中运行良好。
- 如何更改代码，以便我看到第二个下拉列表也填充了以后添加的新行，而不仅仅是已经存在的行？
- 最后，我希望右侧的行仅“附加”到左侧链接到的单个对象。这意味着在左侧选择一个对象应该只显示其各自的测试。我对 Javascript 不是很流利，我从创建一个二维数组的想法开始，但被卡住了。
我知道这可能有点过分，但我非常感谢任何建议。谢谢！
【问题讨论】：
-
firstSelection 定义在哪里？？？... myArray[x][z] = firstSelection.item + firstSelection.index;
-
它应该是对 firstSelection 函数中参数的外部引用。
标签： javascript jquery arrays dynamic