取得値は、（.dataセクションを使用して追加）

Question

$('#test').attr('data-mydata', "{'x-coord': 10}"); 

var myData = $('#test').data("mydata"); 
var x = myData['x-coord']; 
console.log('x-coord: ' + x); 

私は、データが上記の上のdivに添付する。コードが実行されると、DOM要素#testが大きなデータで更新されます。次に、私は "オブジェクト"からデータを取得したい。ただし、mydataには文字列表現が含まれています。この文字列はどのようにしてオブジェクトに変換できますか？要するに、後で処理するためにキーと値のペアを取得するにはどうすればよいですか？ JSON.parseは機能していないようです。ありがとうございました！

http://jsfiddle.net/quint/zyozqwv2/

Answer 1

それは有効 JSONを期待しているためJSON.parseが

を動作するようには思えないまあ、それはです。

{'x-coord': 10}は有効なJSONではありません - それはここに二重引用符を必要とし、{"x-coord": 10}

とすぐに、あなたはもはやそれを自分で解析する必要がないことを修正するよう、.data()が自動的にそれを行います。

$('#test').attr('data-mydata', '{"x-coord": 10}'); // switched quotes here 

var myData = $('#test').data("mydata"); 
var x = myData['x-coord']; 
console.log('x-coord: ' + x); // result: x-coord: 10 

http://jsfiddle.net/zyozqwv2/1/

Answer 2

のでJSON.stringifyを使用してJSONオブジェクトを渡し、usinそれを解析何かがあなたのケースでは、いくつかのエンコーディングと間違って起こった、これで試してみてくださいグラムJSON.parse方法は、また、それがベストプラクティスです:)

文字列から来たん

$('#test').data('mydata', JSON.stringify({'x-coord': 10})); 
 

 
    var myData = JSON.parse($('#test').data("mydata")); 
 
    var x = myData['x-coord']; 
 
    console.log('x-coord: ' + x);

#test { 
 
    width: 100px; 
 
    height: 100px; 
 
    background-color: green; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<div id = 'test'></div>