Ajax民意调查实施

时间:2017-04-29 07:42:49

标签: php html ajax html5

快速问题我正试图在我的网络应用程序中实现一个简单的Ajax投票。认为它是一个相当简单的过程;但经过几个小时的搜索和实施;我无法判断我是否在我的方面做错了什么,或者它不起作用。跟着w3学校的教程一起试着让一些东西发挥作用;但在选择民意调查选项后;示例表明,没有任何内容更新或更改。

Html文档

out += xbee.read(1)

PHP文件:

<html>
<head>
<script>
function getVote(int) {
  if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  } else {  // code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  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>Who do you want to vote for...</h3>
<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>

文本文件内容:

<?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>

感谢您提供任何帮助和反馈。就像我说的;假设一个简单的解决方案,但我真的很难弄清楚它为什么不起作用

1 个答案:

答案 0 :(得分:0)

不确定您的代码失败的原因,但以下内容可能会有用。对我来说,你使用的数组结构看起来有点麻烦 - json似乎是一个更好的选择,这就是为什么我选择下面的方法。希望它有所帮助...

<?php
    if( isset( $_GET['vote'] ) ){

        /* for testing - file in same directory as script */
        $filename=__DIR__ . '\\poll.txt';

        /* If the file exists, read it otherwise create empty object to store vote */
        $contents=file_exists( $filename ) ? json_decode( file_get_contents( $filename ) ) : (object)array('yes'=>0,'no'=>0);

        /* get the value of the vote cast */
        $vote=intval( $_GET['vote'] );

        /* increment the respective item */
        switch( $vote ){
            case 0:$contents->yes++; break;
            case 1:$contents->no++; break;
        }

        /* write the data back to the text file */
        file_put_contents( $filename, json_encode( $contents ) );

        /* use the values from the json data */
        $yes=$contents->yes;
        $no=$contents->no;


        /* use an object to aid caluclation of percentages ( makes easier notation imo )*/
        $results=new StdClass;
        $results->yes=100 * round( $yes /( $no + $yes ),2 );
        $results->no=100 * round( $no /( $no + $yes ),2 );


        /* structure the output response */
        $response="
            <h2>Result:</h2>
            <table>
                <tr>
                    <td>Yes:</td>
                    <td>
                        <img src='poll.gif' width='{$results->yes}' height='20'> {$results->yes}%
                    </td>
                </tr>
                <tr>
                    <td>No:</td>
                    <td>
                        <img src='poll.gif' width='{$results->no}' height='20'> {$results->no}%
                    </td>
                </tr>
            </table>";


        /* send the data back to the ajax callback function */
        clearstatcache();
        exit( $response );
    }
?>
<!doctype html>
<html>
    <head>
        <title>Ajax Poll</title>
        <script>
            function getVote(int) {
              if (window.XMLHttpRequest) {
                xmlhttp=new XMLHttpRequest();
              } else {
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
              }
              xmlhttp.onreadystatechange=function() {
                if (this.readyState==4 && this.status==200) {
                  document.getElementById("poll").innerHTML=this.responseText;
                }
              }

              /* you will need to edit the url if you use a separate php script */
              xmlhttp.open("GET","?vote="+int,true);
              xmlhttp.send();
            }
        </script>
    </head>
    <body>
        <div id="poll">
            <h3>Who do you want to vote for...</h3>
            <form>
                <!--
                    curious to know why "yes" has a value of 0 and "no" has a value of 1 - seems
                    kind of back to front...
                -->
                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>