ajaxでjsonファイルを読み込み、メッセージを10秒ごとにランダムに表示するスクリプトが上手く動きません。
構文ミスなどありましたらご教授よろしくお願いいたします。
HTML
1<div class="mesbox"> 2 <p> 3 <span class="message">MESSAGE</span> 4 <span class="penname">PN:PENNAME</span> 5 </p> 6</div>
JavaScript
1function Message(){ 2 var rand; 3 var elem = $(".mesbox"); 4 elem.empty(); 5 var mStr = ''; 6 $.ajax({ 7 url: 'meslist.js', 8 type: 'GET', 9 dataType: 'json' 10 }) 11 .done(function(data) { 12 rand = Math.floor(Math.random() * Number(data.length)-1); 13 mStr += '<p>'; 14 mStr += '<span class="message">' + data[rand].ms + '</span>'; 15 if(data[rand].pn && data[rand].pn.length>0){ 16 mStr += '<span class="penname">PN:' + data[rand].pn + '</span>'; 17 } 18 mStr += '</p>'; 19 elem.html(mStr); 20 elem.animate({opacity: "1", top: "85"}, "slow",function(){ 21 $(this).delay(10000).animate({opacity: "0", top: "70"}, "slow"); 22 }); 23 console.log(rand); 24 }); 25} 26setTimeout(function() { 27 Message(); 28}, 10000);
JSON
1[ 2 { 3 "pn": "hoge", 4 "ms": "あいうえお" 5 }, 6 { 7 "pn": "hoge", 8 "ms": "あいうえお" 9 }, 10 { 11 "pn": "hoge", 12 "ms": "あいうえお" 13 }, 14 { 15 "pn": "hoge", 16 "ms": "あいうえお" 17 }, 18 { 19 "pn": "hoge", 20 "ms": "あいうえお" 21 } 22]
回答3件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。