人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

Ajaxを使ったテキストのランダム表示

予め用意した文章をランダムで表示させたいです。
細かい仕様はコメント欄にてご確認ください。

どうぞよろしくお願い致します。

●質問者: ypressjp
●カテゴリ:インターネット ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● Cherenkov
●200ポイント ベストアンサー

ローカル環境でajaxでファイルを読み込もうとするといくつか制約があります。*1
ローカルサーバを立てて実験すれば大概動きます。
今回は、

この2点を修正すれば動きました。

参考
追記

jqueryを使うとスッキリ書けるのでオススメです。

<HTML>
<HEAD>
<TITLE>いつどこゲーム!?</TITLE>
<meta charset="utf-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<SCRIPT language="JavaScript">
//Ajaxを使ったテキストのランダム表示 予め用意した文章をランダ..
//人力検索はてな http://q.hatena.ne.jp/1328987396
function getData() {
 $.getJSON('data.json', show);
}
function show(data) {
 var day_num = Math.floor(Math.random() * data.time.length) //いつ?
 var peo_num = Math.floor(Math.random() * data.people.length) //誰と?
 var peo2_num //誰が?
 while ((peo2_num = Math.floor(Math.random() * data.people.length)) == peo_num) {}
 var whe_num = Math.floor(Math.random() * data.where.length) //どこで?
 var do_num = Math.floor(Math.random() * data.what.length) //どんなことを?
 document.getElementById('text').innerHTML = "「" + data.time[day_num] + "、" + data.people[peo_num] + "と" + data.people[peo2_num] + "は" + data.where[whe_num] + "で" + data.what[do_num] + "を" + data.endphrase[day_num] + "」";
 //text.innerText = "「" + data.time[day_num] + "、" + data.people[peo_num] + "と" + data.people[peo2_num] + "は" + data.where[whe_num] + "で" + data.what[do_num] + "を" + data.endphrase[day_num] + "」";
}
</SCRIPT>
</HEAD>
<BODY onLoad="getData()">
<!--表示部分-->
<SPAN id="text"> </SPAN>
<!--ここまで-->
</BODY>
</HTML>

*1XMLHttpRequestによる非同期通信がうまくできません javascript.. - 人力検索はてな


ypressjpさんのコメント
度々ありがとうございます!jsは習得がなかなか難しく進まないので大変助かります。今後ともよろしくお願いいたします。ぺこり。
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ