将JSON对象分配给数据字段

Question

我使用javascript动态创建一行，下面是代码：

var row2 = "<tr><td><a href='#editModal' class='modal_trigger' data-info="+name+" data-toggle='modal'>Edit</a></td></tr>";

这里的var是一个JSON对象。 稍后，当用户单击它并且可以检索值时，会将其传递给模态。 但是，简单地像我上面所做的那样声明var设置data-info=[Object object] 。

JSON变量的内容是：

Object
  name: "Test 8"
  created_at: "2015-06-10 16:54:45"
  id: 128
  updated_at: "2015-06-10 16:54:45"
  __proto__: Object

有办法解决吗？

Answer 1

一些建议：

• 不要将var用作变量名，即使在示例中（实际代码甚至不会编译）
• 请确保您了解JSON是什么，因为Javascript对象！= JSON。 显然var在这种情况下是一个JS对象。

说，您可以使用JSON.stringify(variable)将任何不包含函数的JS对象转换为JSON字符串：

更新：这就是我的意思：

var row2 = '<tr><td><a href="#editModal" class="modal_trigger" data-info="'+
        name+'" data-toggle="modal">Edit</a></td></tr>';

（使用引号注意更改）

Answer 2

如果你得到[object Object]那么它不是JSON，而是一个Object。
JSON是一个包含序列化对象的字符串 ，它用作轻量级数据交换格式。

尝试将对象序列化为JSON

"...data-info=" + JSON.stringify(myVar||null) + " data..."

在这里，我将强制添加为null以防止在变量不包含数据时出错。

Answer 3

请使用JSON.stringify(yourVar) 。

var row2 = "<tr><td><a href='#editModal' class='modal_trigger' data-info="+JSON.stringify(yourVar)+" data-toggle='modal'>Edit</a></td></tr>";

Answer 4

将您的name变量存储在某个映射或数组中，将ID或索引存储在您的行中，并使用它来稍后获取它：

// using a mapping :
var infoMapping = {};

function createRow (name) {
    // this will work if 'id' is a key which identifies the object
    infoMapping[name.id] = name;
    var row2 = "<tr><td><a href='#editModal' ... data-infoid="+name.id+" ... ";
    // etc ...
}

function editModal (nRow) {
    var infoid = $(nRow).attr('data-infoid');
    var name = infoMapping[infoid];

    // use name ...
}

Answer 5

var x = {a:10, b:20};
var html = "<div data-info='" + JSON.stringify(x) + "'></div>";

结果是

"<div data-info='{"a":10,"b":20}'></div>"