データをフェッチするサーバー側スクリプトがすでにあるので、必要なのは、データを応答として返し、関数XMLHttpRequest
を使用して処理することだけです。..etccallback
を返したい場合は、配列に入れてエンコードすることができます。提案されているように、を使用できます。PHPスクリプトでは、次のようなことができます。$id, $article, $thumbsup
json_encode()
$Response = array(
'Id' => $id,
'Article' => $article',
'ThumbsUp' => $thumbsup
)
echo json_encode($Response);
exit;
また、Javascriptで、次のような応答ハンドラーを追加する必要がある場合があります。
xmlHttp.onreadystatechange = function() {
if (syndLinkRequest.readyState != 4)
return;
var result = xmlHttp.responseText;
/* if you've returned javascript instead of xml or text,
you can eval(result) to access the javascript variables returned.
*/
// do your thing
}
当然のことながら、テキストファイルにGETを使用する代わりに、データを要求する方法を変更する必要があります。この場合、PHPスクリプトに直接要求して、結果を返すことができます。
xmlhttp.open("GET", "/ajax/update.php", true); // this will return the response
基本的に、必要なのはそれだけです。より簡単な例については、ここを参照してください。
また、jQueryのajax関数も確認してください。
**編集**
追加情報を追加しました。(json_encodeを使用して)JSONである結果を返すため、コンテンツタイプのヘッダーを追加する必要があります。これは、スクリプトの最上部の部分のすぐ下に追加します<?php
。
header('Content-type: application/json');
そして、上記の例に基づいて、これを応答として持っていると仮定します。
$Response = array( 'Id' => $id, 'Article' => $article,'ThumbsUp' => $thumbsup);
echo json_encode($Response);
exit;
関数でこれを受け取ると、これはcallback
(サンプル値を使用して)次のように変換されます。
{"Id":1,"Article":20,"ThumbsUp":30}
これは結果変数に与えられます:
var result = xmlHttp.responseText;
応答が評価されることを確認するためeval()
に、結果文字列に使用して、プロパティにアクセスして値を取得できるようにします。これを例に取ってください:
var result = eval(xmlHttp.responseText);
それが完了すると、例に基づいてresult.ThumbsUp
得られるような結果変数からプロパティにアクセスできます。30
次に、その値を必要な場所に割り当てることができますdocument.getElementById('c').innerHTML = result.ThumbsUp;
。これにより、より明確なアイデアが得られることを願っています。
使用上の注意、これeval()
を読んでください。