【发布时间】：2019-11-19 02:07:57
【问题描述】：
我有一个网页可以从 SQL 表中打印出“库存”，并且可以通过在 列中输入 要移除的数量 来选择移除库存>项目在里面。
注意：SQL 表有“item”和“amount”（库存）行，我在打印的 HTML 表中添加了 amount 列，以便能够从库存中删除项目。
我希望能够标记每个输入标签以使属性“名称”等于项目名称。
例如：
第一行 - <input ... name='Apple'>
第二行 - <input ... name='Banana'>
我使用 jQuery each 循环，打印每一列并使用 attr() 添加属性，但主要问题是它为每一列添加了属性，但它覆盖了每一列的 name 属性。
例如：
第一关：<input ... name='Apple'>
第二遍：<input ... name='10'>
我的尝试：
我尝试通过添加一个 if 语句来解决这个问题name 属性，因此它会添加一个，然后在下一次传递期间，if 条件将为 false，并且不会修改输入标签。
您将从代码中的 cmets 看到我还尝试了哪些其他方法，但似乎都没有给我所需的结果。
这是我用来打印 HTML 表格的 jQuery 代码：
function DISPLAY_INVENTORY(JSON_DATA) {
var COL_NAMES = ['Item', 'Inventory', 'Amount'];
var data = jQuery.parseJSON(JSON_DATA);
var $TABLE_OBJ = $('<table class="table table-striped" >');
$TABLE_OBJ.attr('id', 'student_table');
$list.append($TABLE_OBJ);
// $(output).append($TABLE_OBJ);
//Print a table header
var $ROW_OBJ = $('<tr>');
var $THEAD = $('<thead class="thead-light">');
$THEAD.append($ROW_OBJ);
$TABLE_OBJ.append($THEAD);
for (var j = 0; j < COL_NAMES.length; j++) {
var $TB_HEADER = $('<th>');
$TB_HEADER.html(COL_NAMES[j]);
$ROW_OBJ.append($TB_HEADER);
}
$TBODY = $('<tbody>');
//Print rows
for (var i = 0; i < data.length; i++) {
if (i == data.length - 1) {
$TABLE_OBJ.append($TBODY);
}
$ROW_OBJ = $('<tr>');
$TBODY.append($ROW_OBJ);
//Print columns
$.each(data[i], function(key, value) {
// if (i % 2 == 0) {
// var ITEM_NAME = value;
// }
$COL_OBJ = $('<td>');
$INP_OBJ = $('<input class="text-center form-control" type="text" size="3">');
if (!$INP_OBJ.attr('name')) {
$INP_OBJ.attr('name', value);
// $INP_OBJ.attr('id', ITEM_NAME);
}
// $INP_OBJ.attr('name', ITEM_NAME);
// $INP_OBJ.attr('id', ITEM_NAME);
$COL_OBJ.html(value);
$ROW_OBJ.append($COL_OBJ);
});
$ROW_OBJ.append($INP_OBJ);
}
}
JSON 数据：
[{"item":"Apple","amount":"10"},
{"item":"Banana","amount":"11"},
{"item":"Corn","amount":"12"},
{"item":"Deli Sandwich","amount":"5"},
{"item":"Egg Plant","amount":"12"},
{"item":"French Fries","amount":"15"},
{"item":"Green Beans","amount":"21"},
{"item":"Hamburgers","amount":"7"},
{"item":"Ice Cream","amount":"3"},
{"item":"Jell-O","amount":"12"},
{"item":"Kiwi","amount":"8"},
{"item":"Lima Beans","amount":"32"},
{"item":"Mashed Potatoes","amount":"11"},
{"item":"Noodle Soup","amount":"54"},
{"item":"Orange","amount":"10"},
{"item":"Pear","amount":"5"},
{"item":"Quinoa","amount":"4"},
{"item":"Raisins","amount":"12"},
{"item":"String Cheese","amount":"16"},
{"item":"Tomato Soup","amount":"23"},
{"item":"Unsalted Nuts","amount":"19"},
{"item":"Vienna Sausage","amount":"24"},
{"item":"Wheat Bread","amount":"15"},
{"item":"Xavier Soup","amount":"17"},
{"item":"Yogurt","amount":"11"},
{"item":"Zucchini","amount":"12"}]
如果有人可以帮助我或用逻辑指出我正确的方向，将不胜感激！谢谢。
【问题讨论】：
-
你的 JSON 数据是什么样的？
-
请用minimal reproducible example 更新您的问题，以证明问题，最好是使用堆栈片段（
[<>]工具栏按钮；here's how to do one）可运行。您正在嵌套循环中创建input（$.each循环嵌套在for循环中），但您显示的图片中只有一个input.我看不出显示的代码如何生成您显示的图片。 -
@ConstantinGroß 添加了使用 PHP 从 SQL 表编码的 JSON 数据的编辑
标签： javascript jquery html