1. ホーム
  2. jquery

[解決済み] HTMLのdata属性にJSONオブジェクトを格納する jQuery

2022-05-01 21:45:32

質問

を使用してデータを保存しています。 data- のようなHTMLタグでアプローチします。

<td><"button class='delete' data-imagename='"+results[i].name+"'>Delete"</button></td>

そして、このようにコールバックでデータを取り出しています。

$(this).data('imagename');

これで問題なく動作しています。私が行き詰っているのは、オブジェクトのプロパティの1つだけを保存するのではなく、オブジェクトを保存しようとしていることです。私はこれを実行しようとしました。

<td><button class='delete' data-image='"+results[i]+"'>Delete</button></td>

そして、このようにnameプロパティにアクセスしようとした。

var imageObj = $(this).data('image');
console.log('Image name: '+imageObj.name);

ログによると undefined . ということで、単純な文字列を格納できるようです。 data- 属性はありますが、JSONオブジェクトは格納できません...。

また、この構文の子供を使おうとしましたが、うまくいきませんでした。

<div data-foobar='{"foo":"bar"}'></div>

を使用して実際のオブジェクトをHTMLタグに格納する方法について、何かアイデアがあれば教えてください。 data- というアプローチをとっていますか?

どのように解決するのですか?

テキストに埋め込む代わりに $('#myElement').data('key',jsonObject);

は実際にはhtmlに保存されませんが、jquery.dataを使用している場合は、いずれにせよすべて抽象化されます。

JSONを取得するために パースしない を呼び出すだけです。

var getBackMyJSON = $('#myElement').data('key');

が表示される場合 [Object Object] 直接のJSONではなく、データキーでJSONにアクセスします。

var getBackMyJSON = $('#myElement').data('key').key;