如何在代码点火器中制作一个简单的加一个投票系统

Question

我正在尝试在我的网站上使用jquery制作一个加一个投票系统。我已经构建了html / css结构。我有一个拇指图像，当它悬停在上面时，变成绿色，当有人点击它时，我希望它添加一个+1并随着人们继续按下它而继续递增。

以下是它的样子：

所以当有人点击它时，我希望它将数字添加到加号的右侧。这是我的html结构。

echo "<div id='thumb_holder'>";
echo "<div id='thumb_report'>";
echo "<a href='mailto:info@cysticlife.org'>";
echo "&#149 report";
echo "</a>";
echo "</div>";
echo "<div  class= 'thumb_counter'>";
echo "+";
echo "</div>";
echo "<div id='thumb_thumb'>";
echo "<!--PHP STUFF-->";
echo "<a class='myButtonLink' href=''></a>";
echo "</div>";
echo "</div>";

非常感谢任何有关如何实现这一目标的教程的建议，指导或链接。

Answer 1

首先，您不必回复所有HTML代码，只需在需要动态内容时使用<?php ?>即可。正如dianuj建议你需要使用ajax。使用jquery（为简单起见）对你的ajax处理公共函数进行ajax调用，在那里处理它（例如使用id并递增计数器）然后将一些数据返回给客户端。如果ajax请求成功，则使用javascript更新计数器。

我将从我的应用程序中提供一个示例

codeigniter部分，在控制器内部 我处理一个提供imageid的帖子和用户ID来检查他们的权限和回应 一个回应。对于更复杂的应用程序，您应该出于各种原因使用json。

public function changeImage(){
   if ($this->input->post('imageid')){
   .... handle imageid and userid, check for permissions, query the database..
   ...construct a $response...
   echo $response;
   }
}

在javascript中我使用这样的东西：

$(".dropdown-menu li a").click(function(){

..准备一个mydata数组..

        $.ajax({
                type: "POST",
                url: "<?php echo $base_url; ?>pathtocontroller/changeImage",
                data: mydata,

                success: function(data){
                        //update your counter here
                }

        });

}）;

我认为这可以回答你关于这样做的一般性问题。