-1
次のコードは完璧に動作し、結果を示しています。しかし、私はスライダーとして結果を表示するために、フクロウカルーセルを追加します。これはスライドショーではなく1行のdivです。私のすべてのデータは、WordPressのプラグインからjsonになっています。 ワードプレスjsonデータとフクロウカルーセル
$(document).ready(function(){
$.getJSON("./blog/?json=1",function(data) {
//console.log(data);
for (var i=0;i<data.posts.length;++i){
if (data.posts[i].date.substring(6, 7) == 01){ var mymonth = "Jan"};
if (data.posts[i].date.substring(6, 7) == 02){ var mymonth = "Feb"};
if (data.posts[i].date.substring(6, 7) == 03){ var mymonth = "Mar"};
if (data.posts[i].date.substring(6, 7) == 04){ var mymonth = "Apr"};
if (data.posts[i].date.substring(6, 7) == 05){ var mymonth = "May"};
if (data.posts[i].date.substring(6, 7) == 06){ var mymonth = "Jun"};
if (data.posts[i].date.substring(6, 7) == 07){ var mymonth = "Jul"};
if (data.posts[i].date.substring(6, 7) == 08){ var mymonth = "Aug"};
if (data.posts[i].date.substring(6, 7) == 09){ var mymonth = "Sep"};
if (data.posts[i].date.substring(6, 7) == 10){ var mymonth = "Oct"};
if (data.posts[i].date.substring(6, 7) == 11){ var mymonth = "Nov"};
if (data.posts[i].date.substring(6, 7) == 12){ var mymonth = "Dec"};
$('.blog-slider').append('<div class="item"><a href="'+data.posts[i].url+'"><div><img src="' + data.posts[i].attachments[0].url + '" class="img-responsive" target="new"></div></a><ul><li><span>'+ data.posts[i].date.substring(8, 11) +'<br>'+ mymonth +'</span></li><li><span>'+ data.posts[i].title + '</span></li></ul></div>');
//console.log(mnth[meme]);
}
});
});
と私のフクロウカルーセル構成は
$(document).ready(function() {
$('.blog-slider').owlCarousel({
loop:true,
margin:0,
nav:false,
autoplay:true,
autoplayTimeout:4000,
responsive:{
0:{
items:1
},
600:{
items:2
},
1000:{
items:3
}
}
});
親切にアドバイス
url: 'json/data.json'、それはurlではありません: 'blog /?json = 1' –
あなたの追加呼び出しは意味をなさないでしょう。部分的なHTMLコードを渡すことによって要素を追加することはできません。 " – CBroe
私はdocument.writeを試して、そのスクリプトをスライダdiv内に配置しましたが、それでもうまくいきませんでした。 –