通过从表的输入字段中获取值来解析和访问JSON中的数据：JavaScript

Question

var data = '[';
$("#table tr").each(function() {
  data += '{"name":"' +     $(this).find('td').eq(0).find('input[type="text"]').val() + 
          '","id":"' +      $(this).find('td').eq(0).find('input[type="hidden"]').val() + 
          '","age":"' +     $(this).find('td').eq(1).find('input[type="text"]').val() + 
          '","qty":"' +     $(this).find('td').eq(2).find('input[type="text"]').val() + 
          '","perc":"' +    $(this).find('td').eq(3).find('input[type="text"]').val() + 
          '","address":"' + $(this).find('td').eq(4).find('input[type="text"]').val() + '"},'
  });
  data += ']';

如何解析和访问数据？我希望输出为第一个输入字段的第一个值。

我尝试做这样的事情

var p = data;
var arr = JSON.parse(JSON.stringify(p));
alert(arr[0].name);

上面的代码给出未定义的值。

Answer 1

IMO，您不应该构造字符串然后转换为json。您可以直接创建Javascript对象。

var data = [];
$("#table tr").each(function() {
    data.push({
        name: $(this).find('td').eq(0).find('input[type="text"]').val(),
        id: $(this).find('td').eq(0).find('input[type="hidden"]').val(),
        age: $(this).find('td').eq(1).find('input[type="text"]').val(),
        qty: $(this).find('td').eq(2).find('input[type="text"]').val(),
        perc: $(this).find('td').eq(3).find('input[type="text"]').val(),
        address: $(this).find('td').eq(4).find('input[type="text"]').val()
    })
});

Answer 2

我认为，如果您尝试自己生成JSON，将会遇到各种各样的问题，我会做这样的事情：

var data = [];
$("#table tr").each(function() {
    data.push({
        name: $(this).find('td').eq(0).find('input[type="text"]').val(),
        id: $(this).find('td').eq(0).find('input[type="hidden"]').val(), 
        age: $(this).find('td').eq(1).find('input[type="text"]').val(),
        qty: $(this).find('td').eq(2).find('input[type="text"]').val(),
        perc: $(this).find('td').eq(3).find('input[type="text"]').val(),
        address: $(this).find('td').eq(4).find('input[type="text"]').val()
    });
});
console.log(data[0].name);

Answer 3

也许是这样：

我们可以使用地图，发布您的HTML，然后我将更新脚本

let data = [];
$("#table tr").each(function() {
  data.push({})
  const obj = data[data.length-1]
  $(":input",this).each(function() {
    obj[$(this).attr("name")] = $(this).val()
  })
})