0

data-属性を介してhtmlタグからjquery ..にjsonデータを送信すると、たとえば完璧に機能します

HTML :

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

たとえば、次のように、jquery で data-info json opject を簡単に取得できます。

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/

私の問題はまさに " or ' with data-info=" {..} " にあると思いますが、本当に何時間も最善を尽くしましたが、運がありませんでした..

助けはありますか？ありがとう ..

4

2 に答える 2

2

オブジェクトを文字列に追加する前に、まずオブジェクトを文字列化する必要があります。JSON.stringify(getInfo)行の代わりに使用getInfoしitems.pushます。

于 2013-06-26T03:37:20.263 に答える
0

オブジェクトを JSON テキストに変換するために使用JSON.stringifyします。現在、 からのデフォルト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 に答える