PHP 示例 - AJAX 投票
AJAX 投票
下面的示例將演示一個無需重新載入即可顯示結果的投票。
您到目前為止喜歡 PHP 和 AJAX 嗎?
示例說明 - HTML 頁面
當用戶選擇上面的選項時,會執行一個名為“getVote()”的函式。該函式由“onclick”事件觸發
<html>
<head>
<script>
function getVote(int) {
var xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function() {
if (this.readyState==4 && this.status==200) {
document.getElementById("poll").innerHTML=this.responseText;
}
}
xmlhttp.open("GET","poll_vote.php?vote="+int,true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="poll">
<h3>您到目前為止喜歡 PHP 和 AJAX 嗎?</h3>
<form>
是:<input type="radio" name="vote" value="0" onclick="getVote(this.value)"><br>
否:<input type="radio" name="vote" value="1" onclick="getVote(this.value)">
</form>
</div>
</body>
</html>
getVote() 函式執行以下操作
- 建立一個 XMLHttpRequest 物件
- 建立伺服器響應準備好時要執行的函式
- 將請求傳送到伺服器上的檔案
- 請注意,引數(vote)已新增到 URL 中(帶有是或否選項的值)
PHP 檔案
由上面的 JavaScript 呼叫的伺服器上的頁面是名為“poll_vote.php”的 PHP 檔案
<?php
$vote = $_REQUEST['vote'];
//獲取文字檔案的內容
$filename = "poll_result.txt";
$content = file($filename);
//將內容放入陣列
$array = explode("||", $content[0]);
$yes = $array[0];
$no = $array[1];
if ($vote == 0) {
$yes = $yes + 1;
}
if ($vote == 1) {
$no = $no + 1;
}
//將投票插入文字檔案
$insertvote = $yes."||".$no;
$fp = fopen($filename,"w");
fputs($fp,$insertvote);
fclose($fp);
?>
<h2>結果:</h2>
<table>
<tr>
<td>是:</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>否:</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”檔案的內容
- 將檔案內容放入變數中,併為選定的變數加一
- 將結果寫入“poll_result.txt”檔案
- 輸出投票結果的圖形表示
文字檔案
文字檔案(poll_result.txt)是我們儲存投票資料的地方。
它的儲存方式如下
0||0
第一個數字表示“是”票數,第二個數字表示“否”票數。
注意:請記住允許您的 Web 伺服器編輯文字檔案。不要給所有人訪問許可權,只給 Web 伺服器(PHP)訪問許可權。