PHP-Beispiele -AJAX-Umfrage

AJAX-Umfrage

Im folgenden Beispiel demonstrieren wir ein Abstimmungsprogramm, durch das die Abstimmungsergebnisse angezeigt werden, ohne dass die Webseite neu geladen wird.

Mögen Sie PHP und AJAX?

Ja:
Nein:

Beispiel erklärt – 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.htmlDer Code der Datei lautet wie folgt:

<html>
<head>
<meta charset="utf-8">
<title>Example(example.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>

Die Funktion getVote() führt die folgenden Schritte aus:

  • Erstellen Sie ein XMLHttpRequest-Objekt
  • Erstellen Sie eine Funktion, die ausgeführt wird, wenn die Serverantwort bereit ist
  • Senden einer Anfrage an die Datei auf dem Server
  • Beachten Sie den Parameter (q), der am Ende der URL angehängt wird (und den Inhalt der Dropdown-Liste enthält)

PHP-Datei

Die oben über JavaScript aufgerufene Serverseite ist eine PHP-Datei namens "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 JavaScript an die PHP-Datei gesendet wird, geschieht Folgendes:

  1. Rufen Sie den Inhalt der Datei "poll_result.txt" ab
  2. Speichern Sie den Dateiinhalt in Variablen und addieren Sie 1 zur ausgewählten Variablen
  3. Schreibe das Ergebnis in die Datei "poll_result.txt"
  4. Gib das grafische Abstimmungsergebnis aus

Textdatei

Die Textdatei (poll_result.txt) speichert die Daten aus dem Abstimmungsprogramm.

Die gespeicherten Daten sind wie folgt:

3||4

Die erste Zahl steht für die Anzahl der "Ja"-Stimmen, und die zweite Zahl steht für die Anzahl der "Nein"-Stimmen.

Hinweis:Erlaube nur deinem Webserver, diese Textdatei zu bearbeiten.Gibniemandem sonst Zugriff, außer dem Webserver (PHP).

Andere Erweiterungen