Heim > Artikel > Backend-Entwicklung > Demo zur AJAX-Abstimmung
Demo zur AJAX-Abstimmung
- jackloveOriginal
- 2018-05-07 15:12:371426Durchsuche
Demonstrieren Sie ein Abstimmungsprogramm, mit dem die Abstimmungsergebnisse angezeigt werden, ohne die Webseite zu aktualisieren. In diesem Artikel wird die Wirkung der Abstimmung demonstriert.
Erläuterung der Beispiele – HTML-Seite
Wenn der Benutzer eine der oben genannten Optionen auswählt, wird eine Funktion namens „getVote()“ ausgeführt. Diese Funktion wird durch das Ereignis „onclick“ ausgelöst.
poll.html-Dateicode lautet wie folgt:
<html><head><meta charset="utf-8"><title>菜鸟教程(runoob.com)</title><script>function getVote(int) {
if (window.XMLHttpRequest) {
// IE7+, Firefox, Chrome, Opera, Safari 执行代码
xmlhttp=new XMLHttpRequest();
} else {
// IE6, IE5 执行代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("poll").innerHTML=xmlhttp.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()-Funktion führt die folgenden Schritte aus:
XMLHttpRequest-Objekt erstellen
Erstellen, wenn die Serverantwort ist bereit. Die ausgeführte Funktion
sendet eine Anfrage an die Datei auf dem Server
Bitte beachten Sie den am Ende der URL hinzugefügten Parameter (q) (der den Inhalt von Dropdown-Liste )
PHP-DateiDie vonJavaScript oben aufgerufene Serverseite ist eine PHP-Datei mit dem Namen „poll_vote.php“:
<?php
$vote = htmlspecialchars($_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>
<span style="display: inline-block; background-color:green;
width:<?php echo(100*round($yes/($no+$yes),2)); ?>px;
height:20px;" ></span>
<?php echo(100*round($yes/($no+$yes),2)); ?>% </td>
</tr>
<tr>
<td>否:</td>
<td>
<span style="display: inline-block; background-color:red;
width:<?php echo(100*round($no/($no+$yes),2)); ?>px;
height:20px;"></span>
<?php echo(100*round($no/($no+$yes),2)); ?>% </td>
</tr></table>Wenn der ausgewählte Wert von stammt Wenn JavaScript an eine PHP-Datei gesendet wird, passiert Folgendes: Den Inhalt der Datei „poll_result.txt“ abrufen Die Datei ablegen Inhalte in eine Variable und addiere 1 zur ausgewählten VariablenSchreiben Sie die Ergebnisse in die Datei „poll_result.txt“Geben Sie die grafischen Abstimmungsergebnisse ausTextdateiDie Textdatei (poll_result.txt) speichert die Ergebnisse aus den Abstimmungsprogrammdaten. Die gespeicherten Daten lauten wie folgt: 3||4
Verwandte Wissenspunkte zum AJAX-RSS-Reader
PHP-Beispiel – AJAX-Echtzeitsuche-bezogenes Wissen
Über PHP-Beispiel – AJAX-Interaktion mit XML
Das obige ist der detaillierte Inhalt vonDemo zur AJAX-Abstimmung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!