JavaScriptを.jsonファイルから読み込むにはどうすればよいですか？

私のスクリプトは、現在、次のようになります。日付の「x」およびイベントは、「X」のhtmlタグのシリーズですJavaScriptを.jsonファイルから読み込むにはどうすればよいですか？

<script type="text/javascript"> 
    function updateMe(){ 
    var x = 0; 
    var jsonstr = '{"date":"July 4th", "event":"Independence Day"}'; 
    var activity=JSON.parse(jsonstr); 
    while(x<10){ 
    date = document.getElementById("date"+x).innerHTML = activity.date; 
    event = document.getElementById("event"+x).innerHTML = activity.event; 
    x++; 
    } 
    } 
</script>

。この関数は、ページが読み込まれる（onload）ときに実行されます。私の目標は、上記のハードコードとは対照的に、ローカルの.jsonファイルからのみ、まったく同じことを行うことです。私はすでにhttp://api.jquery.com/jQuery.getJSON/をチェックアウトしました。

{"date":"July 4th", "event":"Independence Day"}

任意の提案：

ローカル.jsonファイルには、次のようになりますか？

出典

2011-07-15 MTP

abc.jsonあなたは明確でした。 – ironchefpython

申し訳ありません。これはファイルシステム上のjsonファイルで、htmlページと同じフォルダに保存されています。 – MTP

それから、私が与えた答えは、jsonpでフォーマットされたファイルを使って、あなたが探しているものです。あなたの質問が満足に答えられたときに受け入れられた答えに印を付けることを忘れないでください。 – ironchefpython

あなたが.jsonファイルを言うとき、あなたは "ローカルファイルシステム上のファイル"を意味すると仮定します。

jsonpとしてフォーマットされたjsonデータを保存し、それにアクセスするにはfile:// urlを使用する必要があります。

あなたのHTMLは次のようになります。

<script src="file://c:\\data\\activity.jsonp"></script> 
<script type="text/javascript"> 
    function updateMe(){ 
    var x = 0; 
    var activity=jsonstr; 
    foreach (i in activity) { 
     date = document.getElementById(i.date).innerHTML = activity.date; 
     event = document.getElementById(i.event).innerHTML = activity.event; 
    } 
    } 
</script>

そして、ファイルc：\データ\のactivity.jsonpは、次の行が含まれます。

jsonstr = [ {"date":"July 4th", "event":"Independence Day"} ];

出典

2011-07-15 17:42:25 ironchefpython

ありがとうございます...これはとても役に立ちました。しかし、JSONPの個々の要素にアクセスする方法はまだわかりません。私はすべての '活動'を印刷することはできますが、私はactivity.dateを試してみると 'Undefined'と叫びます。理由は何ですか？私は現在、テストのためにalert（）を使用しています。 – MTP

元の質問の下に編集を追加して、使用しているJSONPファイルの内容を表示できますか？ – ironchefpython

.jsonpファイルのパスは失敗します。バックスラッシュはエスケープとして認識され、そのドライブには "c：dataactivity.jsonp"という文字列が含まれている可能性があります。ファイルURLはスラッシュを使用します。 –

あなたはそれが好き行うことができます... ちょうど...あなたのJSONファイルの適切なパスを与える

<!doctype html> 
<html> 
    <head> 
     <script type="text/javascript" src="abc.json"></script> 
      <script type="text/javascript" > 
       function load() { 
        var mydata = JSON.parse(data); 
        alert(mydata.length); 

        var div = document.getElementById('data'); 

        for(var i = 0;i < mydata.length; i++) 
        { 
         div.innerHTML = div.innerHTML + "<p class='inner' id="+i+">"+ mydata[i].name +"</p>" + "<br>"; 
        } 
       } 
     </script> 
    </head> 
    <body onload="load()"> 
    <div id= "data"> 

    </div> 
    </body> 
</html>

データを取得してdivに追加するだけです...最初は長さをアラートで表示します。ここで

は私のJSONファイルです：あなたは、「ファイルシステム上のJSONファイル」、または「Webサーバ上でホストされているJSONファイル」を意味する場合

data = '[{"name" : "Riyaz"},{"name" : "Javed"},{"name" : "Arun"},{"name" : "Sunil"},{"name" : "Rahul"},{"name" : "Anita"}]';

出典

2017-07-31 19:46:21 javed

JavaScriptを.jsonファイルから読み込むにはどうすればよいですか？

答えて

関連する問題