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


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

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

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2012/02/12 04:09:56
  • 終了:2012/02/12 16:05:00

ベストアンサー

id:Cherenkov No.1

Cherenkov回答回数1503ベストアンサー獲得回数4932012/02/12 09:09:18

ポイント200pt

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

  • サーバを立てずにリクエストするとhttp_request.statusが200で返ってこない。
    • if (http_request.status == 0) { にすればサーバを立てずに一応確認はできる。
  • innerText属性はIEの独自属性。
    • 「text.innerText = 」の部分を「document.getElementById('text').textContent = 」に変える。(textContentまたはinnerHTML)。

この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>
id:ypressjp

度々ありがとうございます!jsは習得がなかなか難しく進まないので大変助かります。今後ともよろしくお願いいたします。ぺこり。

2012/02/12 16:04:52

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません