ThinkPHP5 + jQuery + MySql如何实现投票功能

  介绍

这篇文章主要介绍了ThinkPHP5 + jQuery + MySql如何实现投票功能,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获、下面让小编带着大家一起了解一下。

<强>首先效果图如下:

癟hinkPHP5

<强>然后分享代码如下:

<强>前端代码:

& lt; ! DOCTYPE  HTML>   & lt; html>   & lt; head>   & lt; meta  charset=皍tf-8"祝辞   & lt; title>基于THINKPHP5实现红蓝投票功能& lt;/title>   & lt; style 类型=拔谋?css"比;   ,,,.vote{宽度:288 px;,身高:300 px;,保证金:40 px 汽车;位置:相对}   ,,,.votetitle{宽度:100%;高度:62 px;,背景:url(/静态/索引/图片/程序),no-repeat  0, 30 px;,字体大小:15 px}   ,,,r{:绝对;,左:0;,最高:64 px;,身高:80 px;}   ,,,.blue{:绝对;,右:0;,最高:64 px;,身高:80 px;}   ,,,.red  p, .blue  p{行高:22 px}   ,,,.redhand{:绝对;,左:0;宽度:36 px;,高度:36 px;,背景:url(/静态/索引/图片/程序),no-repeat  1 px  -38 px;游标:指针}   ,,,.bluehand{:绝对;,右:0;宽度:36 px;,高度:36 px;,背景:url(/静态/索引/图片/程序),no-repeat  -41 px  -38 px;游标:指针}   ,,,.grayhand{宽度:34 px;,高度:34 px;,背景:url(/静态/索引/图片/程序),no-repeat  -83 px  -38 px;游标:指针}   ,,,.redbar{:绝对;,左:42 px;, margin-top: 8 px;}   ,,,.bluebar{:绝对;,右:42 px;, margin-top: 8 px;,}   ,,,.redbar 跨度{显示:块;,高度:6 px;,背景:红色;,宽度:100%;border - radius: 4 px;}   ,,,.bluebar 跨度{显示:块;,高度:6 px;,背景:# 09年f;,宽度:100%;border - radius: 4 px;,位置:绝对的,,右:0}   ,,,.redbar  p{行高:20 px;,颜色:红色;}   ,,,.bluebar  p{行高:20 px;,颜色:# 09年f;, text-align:正确的;,margin-top: 6 px}   & lt;/style>   & lt; script 类型=拔谋?javascript", src=?静态/索引/js/jquery.js"祝辞& lt;/script>   & lt; script 类型=拔谋?javascript"比;   $(函数(){   ,,,//,获取初始数据   ,,,getdata (& # 39; & # 39; 1);   ,,,,   ,,,$ (“.redhand") .click(函数(){   ,,,,,,,getdata (“red", 1);   ,,,});   ,,,$ (“.bluehand") .click(函数(){   ,,,,,,,getdata (“blue", 1);   ,,,});   });   function  getdata(类型,vid) {   ,,,. ajax({美元   ,,,,,url:,“{: url(& # 39;/索引/票/投票# 39;)}“,   ,,,,,数据:,{类型:类型,vid: vid},   ,,,,,类型:& # 39;文章# 39;   ,,,,,数据类型:,& # 39;json # 39;   ,,,,,成功:,function  (res), {   ,,,,,,,,,console.log (res)   ,,,,,,,,,if  (res.status ==, 0), {   ,,,,,,,,,,,,,警报(& # 39;投票成功& # 39;)   ,,,,,,,,,,,,,var  w =, 208;   ,,,,,,,,,,,美元(“# red_num") . html (res.msg.rednum);   ,,,,,,,,,,,(“# red")美元。css (“width" res.msg.red_percent * 100 +“%”);   ,,,,,,,,,,,var  red_bar_w =, w * res.msg.red_percent-10;   ,,,,,,,,,,,(“# red_bar")美元。css (“width" red_bar_w);   ,,,,,,,,,,,美元(“# blue_num") . html (res.msg.bluenum);   ,,,,,,,,,,,(“# blue")美元。css (“width" res.msg.blue_percent * 100 +“%”);   ,,,,,,,,,,,var  blue_bar_w =, w * res.msg.blue_percent;   ,,,,,,,,,,,(“# blue_bar")美元。css (“width" blue_bar_w);   ,,,,,,,,,其他}{   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null

ThinkPHP5 + jQuery + MySql如何实现投票功能