jsonとjQueryを使ってindex.htmlにコードを生成させたいのですが、コードが生成されません。
ローカル上ではなく、同一ドメインのサーバーへ上げて確認しています。
どのようにすれば実装できますか?
json
1{"release": [ 2 3{ 4"tabName": "new-tab", 5"url": "url", 6"img": "src", 7"labelName": "new-label", 8"dateText": "5/24新作", 9"price": "3,132" 10}, 11 12{ 13"tabName": "new-tab", 14"url": "url", 15"img": "src", 16"labelName": "new-label", 17"dateText": "5/24新作", 18"price": "3,132" 19}, 20 21{ 22"tabName": "new-tab", 23"url": "url", 24"img": "src", 25"labelName": "new-label", 26"dateText": "5/24新作", 27"price": "3,132" 28} 29 30]}
jQuery
1$(document).ready(function(){ 2 3 //HTMLを初期化 4 $(".json-box").html(""); 5 6 //HTMLを生成 7 $.getJSON("json/index/index.json", function(data){ 8 $(data.release).each(function(){ 9 $('<div class="col1' + this.tabName + 'tab-elm" data-category="' + this.tabName + '">'+ 10 '<a href="' + this.url + '" target="_top" class="block">'+ 11 '<img src="' + this.img + '" alt="">'+ 12 '</div>'+ 13 '<div class="label-wrap">'+ 14 '<p class="img-label' + this.labelName + '">' + this.dateText + '</p>'+ 15 '</div>'+ 16 '<p class="price-text">' + this.price + '</p>'+ 17 '</a>'+ 18 '</div>').appendTo('.json-box'); 19 }) 20 }) 21 });
html
1<div class="json-box"></div>
html
1<div class="col1 new-tab tab-elm" data-category="new-tab"> 2<a href="url" target="_top" class="block"> 3<div class="product-img img-col1"> 4<img src="src" alt=""> 5</div> 6<div class="label-wrap"> 7<p class="img-label new-label">5/24新作</p> 8</div> 9<p class="price-text">3,132円<span>税込</span></p> 10</a> 11</div> 12
最後の分は実現させたいコードです。
よろしくお願い致します。
回答3件
あなたの回答
tips
プレビュー