您的位置:网站主页> Ajax教程 > php使用ajax投票代码|PHP+AJXA投票程序|ajax getVote()函数使用

php使用ajax投票代码|PHP+AJXA投票程序|ajax getVote()函数使用

时间:2018-05-23 03:37:01   编辑:一切随缘   文章来源:php教程网 已阅读:208 次

编程入门教程[www.ask186.com]网站介绍 

    编程入门教程主要涉及WEB开发领域,主要为广大WEB开发人员提供最新的WEB开发资讯信息,包含php教程mysql教程php面试题在线调色板php学习以及常用( Amazon ApiGoogle Api)等API、爱问资源共享HTML转JS不显示xml...[详细]
广告投放: 编程入门教程:www.ask186.com 电话:15818865556

        php使用ajax投票代码|PHP+AJXA投票程序|ajax getVote()函数使用。

        在这个 AJAX 实例中,我们将演示一个投票程序,网页在不重新加载的情况下,就可以获得结果。
        到目前为止,您喜欢 PHP 和 AJXA 吗?
        Yes: 
        No: 

        本例包括四个元素:

        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 页面包含一个简单的 HTML 表单,其中的 <div> 元素带有两个单选按钮。

        表单这样工作:

        当用户选择 "yes" 或 "no" 时,会触发一个事件
        当事件触发时,执行 getVote() 函数
        围绕该表单的是名为 "poll" 的 <div>。当数据从 getVote() 函数返回时,返回的数据会替代该表单。
        文本文件
        文本文件 (poll_result.txt) 中存储来自投票程序的数据。

        它类似这样:

        0||0第一个数字表示 "Yes" 投票,第二个数字表示 "No" 投票。

        注释:记得只允许您的 web 服务器来编辑该文本文件。不要让其他人获得访问权,除了 web 服务器 (PHP)。

        JavaScript
        JavaScript 代码存储在 "poll.js" 中,并于 HTML 文档相连接:

        var xmlHttp

        function getVote(int)
        {
        xmlHttp=GetXmlHttpObject()
        if (xmlHttp==null)
         {
         alert ("Browser does not support HTTP Request")
         return
         }
        var url="poll_vote.php"
        url=url+"?vote="+int
        url=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=null
        if (window.XMLHttpRequest)
         {
         objXMLHttp=new XMLHttpRequest()
         }
        else if (window.ActiveXObject)
         {
         objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
         }
        return objXMLHttp
        }

        例子解释:
        stateChanged() 和 GetXmlHttpObject 函数与 PHP 和 AJAX 请求 这一节中的例子相同。

        getVote() 函数

        当用户在 HTML 表单中选择 "yes" 或 "no" 时,该函数就会执行。

        定义发送到服务器的 url (文件名)
        向 url 添加参数 (vote),参数中带有输入字段的内容
        添加一个随机数,以防止服务器使用缓存的文件
        调用 GetXmlHttpObject 函数来创建 XMLHTTP 对象,并告知该对象当触发一个变化时执行 stateChanged 函数
        用给定的 url 来打开 XMLHTTP 对象
        向服务器发送 HTTP 请求

        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" 文件
        输出图形化的投票结果
 

  • 上一篇:
  • 下一篇:

本文地址:http://www.ask186.com/content/article/ajax/31388.html(转载请保留)

相关关键词搜索:php使用ajax投票代码,PHP+AJXA投票程序,ajax getVote()函数使用

发表评论
      
* 以上用户言论只代表其个人观点,不代表www.ask186.com网站的观点或立场
推荐文档更多
编程入门教程 | PHP教程 | Mysql教程 | Apache教程 | 最新文章 | PHP面试题| 网站地图 | Google地图 | Baidu地图 | 在线WEB论坛| 中纪委反腐最新消息

WEB技术QQ交流群:151963186 站长Q号:547214413
版权所有者:编程入门教程 地址:云南省文山州砚山县盘龙乡 滇ICP备12002707号-1
特别声明:本站内容仅供参考,不作为设计及确切依据!想了解更多,可立即进入Bbs提问