ホームページ >バックエンド開発 >PHPチュートリアル >PHP と AJAX のポーリング
PHP と AJAX のポーリング
- WBOYオリジナル
- 2016-06-23 14:31:50899ブラウズ
AJAX 投票
この AJAX の例では、Web ページがリロードせずに結果を取得できるようにする投票プログラムを示します。
これまでのところ、PHP と AJXA はどうですか?はい:
いいえ:
この例には 4 つの要素が含まれています:
HTML フォーム JavaScript PHP ページ 結果を保存するテキスト ファイルHTML フォーム
これは HTML ページです。これには、単純な HTML フォームと JavaScript ファイルへの接続が含まれています:
<html><head><script src="poll.js"></script> </head><body><div id="poll"><h2>Do you like PHP and AJAX so far?</h2><form>Yes: <input type="radio" name="vote" value="0" onclick="getVote(this.value)"><br />No: <input type="radio" name="vote" value="1" onclick="getVote(this.value)"></form></div></body></html>例の説明 - HTML フォーム
ご覧のとおり、上記の HTML ページには、dc6dce4a544fdca2df29d5ac0ea9906b 要素を持つ単純な HTML フォームが含まれています。
フォームは次のように機能します。
ユーザーが「はい」または「いいえ」を選択すると、イベントがトリガーされ、フォームの周囲にある dc6dce4a544fdca2df29d5ac0ea9906b 関数が実行されます。 「投票」。 getVote() 関数からデータが返されると、返されたデータがフォームを置き換えます。テキスト ファイル
テキスト ファイル (poll_result.txt) には、投票プログラムからのデータが保存されます。
次のようになります:
0||0
最初の数字は「はい」の投票を表し、2 番目の数字は「いいえ」の投票を表します。
注: このテキスト ファイルの編集は Web サーバーのみに許可してください。 Web サーバー (PHP) 以外にはアクセスを許可しないでください。
JavaScript
JavaScript コードは「poll.js」に保存され、HTML ドキュメントに接続されます:
var xmlHttpfunction getVote(int){xmlHttp=GetXmlHttpObject()if (xmlHttp==null) { alert ("Browser does not support HTTP Request") return } var url="poll_vote.php"url=url+"?vote="+inturl=url+"&sid="+Math.random()xmlHttp.onreadystatechange=stateChanged xmlHttp.open("GET",url,true)xmlHttp.send(null)} function stateChanged() { if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { document.getElementById("poll"). innerHTML=xmlHttp.responseText; } } function GetXmlHttpObject(){ var objXMLHttp=nullif (window.XMLHttpRequest) { objXMLHttp=new XMLHttpRequest() }else if (window.ActiveXObject) { objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP") }return objXMLHttp} 例の説明: stateChanged() および GetXmlHttpObject 関数は、このセクションの PHP および AJAX リクエストの例と同じです。
getVote() 関数この関数は、ユーザーが HTML フォームで「はい」または「いいえ」を選択したときに実行されます。
サーバーに送信される URL (ファイル名) を定義します。URL にパラメーター (投票) を追加して、サーバーがキャッシュされたファイルを使用して GetXmlHttpObject を呼び出すのを防ぎます。 XMLHTTP オブジェクトを作成し、変更がトリガーされたときにオブジェクトが stateChanged 関数を実行することを通知する関数。PHP ページ
JavaScript によって呼び出されるサーバー ページ。コードは「poll_vote.php」という名前の単純な PHP ファイルです。
<?php$vote = $_REQUEST['vote'];//get content of textfile$filename = "poll_result.txt";$content = file($filename);//put content in array$array = explode("||", $content[0]);$yes = $array[0];$no = $array[1];if ($vote == 0) { $yes = $yes + 1; }if ($vote == 1) { $no = $no + 1; }//insert votes to txt file$insertvote = $yes."||".$no;$fp = fopen($filename,"w");fputs($fp,$insertvote);fclose($fp);?><h2>Result:</h2><table><tr><td>Yes:</td><td><img src="poll.gif"width='<?php echo(100*round($yes/($no+$yes),2)); ?>'height='20'><?php echo(100*round($yes/($no+$yes),2)); ?>%</td></tr><tr><td>No:</td><td><img src="poll.gif" width='<?php echo(100*round($no/($no+$yes),2)); ?>'height='20'><?php echo(100*round($no/($no+$yes),2)); ?>%</td></tr></table> 説明例: 選択された値が JavaScript から渡されると、何が起こります:
"poll_result.txt" ファイルの内容を取得します ファイルの内容を変数に入れ、選択した変数に 1 を加算します 結果を " に書き込みますグラフの投票結果を出力するためのpoll_result.txtファイル