0

我通过 data-attrbute 从 html 标签发送一些 json 数据到 jquery .. 它工作得很好，例如

HTML：

<li class="get-info" data-path="some path" data-info='{"jid": 1, "name": "Json","post": { "extra":"data"}  }' >
    <a href="#"> link </a>
</li>

我可以轻松地在 jquery 中获取我的数据信息 json 对象，例如：

var sourceInfo = $('.get-info').data('info');  
alert(sourceInfo.name) // wil alert the name : Json  ... which is perfect,

但是，问题是当我像这样通过 jquery 附加相同的链接时：

// 我从 json 文件中获取所有链接 .. 然后将它们全部附加到 ul 中

// 这只是我项目中的一个简单代码“复制粘贴”..

var items = [];  
$.each(jQuery.parseJSON(res), function(key, val) {
    items.push('<li class="get-info" data-path="some path" data-info='+{"jid": 1, "name": "' + val.name + '","post": { "extra":"data"}  } +' ><a href="#"> ' + val.name + '  </a></li>');

    // or 
    var getInfo = {"jid": 1, "name": "Json","post": { "extra":"data"}  }; 
    items.push('<li class="get-info" data-path="some path"  data-info="' + getInfo + '"><a href="#"> ' + val.name + '   </a></li>');    
});                    
// append all my links to a ul 
$('#someDiv').append('<ul>'+  items.join('') +'</ul> ');

现在，当我单击附加的 .get-info 链接时，我无法获取 data-info= json 对象。实际上，当我 alert($('.get-info').data('info')) 时，我得到 [object object] ，但我无法从对象内的键中获取值

前任：

jQuery('.get-info').live('click', function (e) {    
var sourceInfo = $('.get-info').data('info');  
alert(sourceInfo) // = I get :  [object object]! 
alert(sourceInfo.name) // = I get :  undefined!  

I still can get my data-path, 
var path = $('.get-info').data('path');  
alert(path)  // I get : some path

});

更新 您可以在这里查看示例：http: //jsfiddle.net/Q6kKU/197/

我认为我的问题与 " 或 ' 与 data-info=" {..} " 完全相关，但我真的尽力了几个小时但没有运气..

有什么帮助吗？谢谢 ..

4

2 回答 2

2

在将对象附加到字符串之前，您需要先对对象进行字符串化。使用JSON.stringify(getInfo)而不是在行中getInfo。items.push

于 2013-06-26T03:37:20.263 回答
0

用于JSON.stringify将您的对象转换为 JSON 文本。现在你只是得到默认toString输出 ( "[object Object]")，它来自Object.toString.

items.push('<li class="get-info" data-path="some path"  data-info="' + JSON.stringify(getInfo) + '"><a href="#"> ' + val.name + '   </a></li>');
于 2013-06-26T03:37:21.243 回答