我使用以下代码使用JSON对象填充html表 -
html -
<input type="button" value="Generate Table" id="btn" />
<div id="dvTable">
</div>
JS -
$('#btn').click(function () {
var obj = [{ id: 1, name: "bunny", city: "nyc",userinput:"",iscancelled:"" }, { id: 2, name: "sunny", city: "LA",userinput:"",iscancelled:"" }, { id: 3, name: "chubby", city: "PA",userinput:"",iscancelled:"" }
, { id: 4, name: "punny", city: "DC",userinput:"",iscancelled:"" }, { id: 5, name: "money", city: "Pen",userinput:"",iscancelled:"" }];
alert(JSON.stringify(obj));
var table = document.createElement("table");
table.border = "1";
var columnCount = obj[0].length;
var row = table.insertRow(-1);
for (var i = 0; i < columnCount; i++) {
var headerCell = document.createElement("th");
headerCell.innerHTML = obj[0][i];
row.appendChild(headerCell);
}
$.each(obj, function (i, obj) {
row = '<tr data-id="' + obj.id + '"><td><input type="checkbox" value=' + obj.id + '></td><td>' + obj.id + '</td><td>' + obj.name + '</td><td>'
+ obj.city + '</td><td><input type="text" id="address" ></td></tr>';
table.append(row);
});
var dvTable = document.getElementById("dvTable");
dvTable.innerHTML = "";
dvTable.appendChild(table);
});
为简单起见,我采用了一个小的JSON对象,但通常我有一个非常重的对象。我想获取用户在每个文本框中输入的值并将其保存在&#39; userinput&#39; JSON对象的每个元素的字段。此外,我还想保存if&#39;复选框&#39;是否检查并保存&#39; Y&#39;或者&#39; N&#39;在&#39; iscancelled&#39; JSON对象的字段。
我为此编写了以下代码,但这似乎不起作用。可能是什么问题?
var revArray="";
$("[type='input']").each(function () {
revArray = $(this).val;
});
$.each(obj, function (i, obj) {
for (var i = 0; i < revArray.length; i++) {
obj.userInput= revArray[i];
}
if ($("[type='checkbox']:checked"))
obj.isCancelled = 'Y';
else
obj.isCancelled = 'N';
alert(JSON.stringify(obj));
答案 0 :(得分:1)
所以我最终使用jquery以下列方式完成了访问表格的每一行,然后在该行上找到文本框 -
$('table tr:gt(0)').each(function (i, row) {
var $row = $(row);
var val1 = $row.find('input[type="text"]').val();
});
对于那些面临这样问题的人来说,可以使用它,效果非常好!