ThinkPHP5+jQuery+MySql-Methode zur Implementierung der Abstimmungsfunktion-Denken Sie an PHP-php.cn

Inhaltsverzeichnis

ThinkPHP5+jQuery+MySql实现红蓝投票功能" >ThinkPHP5+jQuery+MySql实现红蓝投票功能

Heim

PHP-Framework

Denken Sie an PHP

ThinkPHP5+jQuery+MySql-Methode zur Implementierung der Abstimmungsfunktion

藏色散人

Jan 21, 2020 pm 05:45 PM

jquery mysql thinkphp5

In der folgenden Spalte des ThinkPHP-Tutorials wird Ihnen die Methode zur Verwendung von ThinkPHP5+jQuery+MySql zur Implementierung der Abstimmungsfunktion vorgestellt. Ich hoffe, dass sie Freunden, die sie benötigen, hilfreich sein wird!

ThinkPHP5+jQuery+MySql-Methode zur Implementierung der Abstimmungsfunktion

Das erste Rendering ist wie folgt:

ThinkPHP5+jQuery+MySql-Methode zur Implementierung der Abstimmungsfunktion

Dann teilen Sie den Code wie folgt:

Front-End-Code:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>基于THINKPHP5实现红蓝投票功能</title>
<style type="text/css">
    .vote{width:288px; height:300px; margin:40px auto;position:relative}
    .votetitle{width:100%;height:62px; background:url(/static/index/images/icon.png) no-repeat 0 30px; font-size:15px}
    .red{position:absolute; left:0; top:64px; height:80px;}
    .blue{position:absolute; right:0; top:64px; height:80px;}
    .red p,.blue p{line-height:22px}
    .redhand{position:absolute; left:0;width:36px; height:36px; background:url(/static/index/images/icon.png) no-repeat -1px -38px;cursor:pointer}
    .bluehand{position:absolute; right:0;width:36px; height:36px; background:url(/static/index/images/icon.png) no-repeat -41px -38px;cursor:pointer}
    .grayhand{width:34px; height:34px; background:url(/static/index/images/icon.png) no-repeat -83px -38px;cursor:pointer}
    .redbar{position:absolute; left:42px; margin-top:8px;}
    .bluebar{position:absolute; right:42px; margin-top:8px; }
    .redbar span{display:block; height:6px; background:red; width:100%;border-radius:4px;}
    .bluebar span{display:block; height:6px; background:#09f; width:100%;border-radius:4px; position:absolute; right:0}
    .redbar p{line-height:20px; color:red;}
    .bluebar p{line-height:20px; color:#09f; text-align:right; margin-top:6px}
</style>
<script type="text/javascript" src="/static/index/js/jquery.js"></script>
<script type="text/javascript">
$(function(){
    // 获取初始数据
    getdata(&#39;&#39;,1);
    
    $(".redhand").click(function(){
        getdata("red",1);
    });
    $(".bluehand").click(function(){
        getdata("blue",1);
    });
});
function getdata(type,vid){
    $.ajax({
      url: "{:url(&#39;/index/vote/vote&#39;)}",
      data: {type:type,vid:vid},
      type:&#39;POST&#39;,
      dataType: &#39;json&#39;,
      success: function (res) {
          console.log(res)
          if (res.status == 0) {
              alert(&#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);
          }else{
              alert(&#39;投票失败&#39;);
          }
      }
    });
}
</script>
</head>
<body>
<div id="main">
   <h2 id="a-nbsp-href-http-www-jb-net-article-htm-ThinkPHP-jQuery-MySql实现红蓝投票功能-a"><a href="http://www.jb51.net/article/71504.htm">ThinkPHP5+jQuery+MySql实现红蓝投票功能</a></h2>
   <div class="vote">
        <div class="votetitle">您对Thinkphp5的看法？</div>
        <div class="red" id="red">
            <p>非常实用</p>
            <div class="redhand"></div>
            <div class="redbar" id="red_bar">
                <span></span>
                <p id="red_num"></p>
            </div>
        </div>
        <div class="blue" id="blue">
            <p style="text-align:right">完全不懂</p>
            <div class="bluehand"></div>
            <div class="bluebar" id="blue_bar">
                <span></span>
                <p id="blue_num"></p>
            </div>
        </div>
   </div>
</div>
</body>
</html>

Nach dem Login kopieren

Controller:

<?php
namespace app\index\controller;
use think\Controller;
/**
 * 投票
 */
class Vote extends Controller
{
    /**
     * 首页
     */
    public function index()
    {
        return $this->fetch();
    }
    /**
     * 投票
     * @param vid type ip
     */
    public function Vote()
    {
        $data = input(&#39;post.&#39;);
        if (!empty($data)) {
            $data[&#39;ip&#39;] = get_ip();    //获取Ip
            // 先检测当前ip是否已经投过票
            $count = model(&#39;Vote&#39;)->checkIp($data);
            // 检测是否提交了type,提交了即代表点击了按钮,没提交即代表页面初次渲染
            if (!empty($data[&#39;type&#39;])) {
                if ($count == &#39;0&#39;) {    //当前还未投过票 
                    // 更新票数  添加用户ip表
                    $res = model(&#39;Vote&#39;)->postVote($data);
                    if ($res) {
                        
                        // 投票成功  获取当前各自的票数
                        $info = $this->getPercent($data);
                        return return_succ($info);
                    }else{
                        return return_error(&#39;投票失败&#39;);
                    }
                }else{
                    // 已经投过票
                    return return_error(&#39;您已经投过票了&#39;);
                }
            }else{
                // 初次渲染,获取初始数据
                $info = $this->getPercent($data);
                return return_succ($info);
            }
        }else{
            return return_error(&#39;数据不能为空&#39;);
        }
    }
    // 计算比例
    public function getPercent($data)
    {
        // 投票成功  获取当前各自的票数
        $info = model(&#39;Vote&#39;)->getInfo($data);
        // 计算比例 保留3位小数
        $info[&#39;red_percent&#39;] = round($info[&#39;rednum&#39;] / ($info[&#39;rednum&#39;] + $info[&#39;bluenum&#39;]),3);
        $info[&#39;blue_percent&#39;] = 1 - $info[&#39;red_percent&#39;];
        return $info;
    }
}

Nach dem Login kopieren

Modell:

<?php
namespace app\index\model;
use think\Model;
use think\Db;
class Vote extends Model
{
    // 检测当前ip是否已经投过票
    public function checkIp($data)
    {
        $res = Db::table(&#39;votes_ip&#39;)->where([&#39;vid&#39;=>$data[&#39;vid&#39;],&#39;ip&#39;=>$data[&#39;ip&#39;]])->count();
        return $res;
    }
    // 投票
    public function postVote($data)
    {
        $info = $this->getInfo($data);
        if ($info) {
            Db::startTrans();
            try {
                
                if ($data[&#39;type&#39;] == "red") {
                    // 更新票数表  
                    Db::table(&#39;votes&#39;)->where([&#39;id&#39;=>$data[&#39;vid&#39;]])->update([&#39;rednum&#39;=>$info[&#39;rednum&#39;]+1]);
                }elseif ($data[&#39;type&#39;] == "blue") {
                    Db::table(&#39;votes&#39;)->where([&#39;id&#39;=>$data[&#39;vid&#39;]])->update([&#39;bluenum&#39;=>$info[&#39;bluenum&#39;]+1]);
                }
                // 添加用户投票ip
                Db::table(&#39;votes_ip&#39;)->insert([&#39;vid&#39;=>$data[&#39;vid&#39;],&#39;ip&#39;=>$data[&#39;ip&#39;]]);
                Db::commit();
                return true;
            } catch (Exception $e) {
                Db::rollback();
                return false;
            }
        }
    }
    // 获取当前各自的票数
    public function getInfo($data)
    {
        // 获取各自的票数
        $info = Db::table(&#39;votes&#39;)->where([&#39;id&#39;=>$data[&#39;vid&#39;]])->find();
        return $info;
    }
}

Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonThinkPHP5+jQuery+MySql-Methode zur Implementierung der Abstimmungsfunktion. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heißer Artikel

Assassin's Creed Shadows: Seashell Riddle -Lösung

3 Wochen vor By DDD

Was ist neu in Windows 11 KB5054979 und wie Sie Update -Probleme beheben

2 Wochen vor By DDD

Wo kann man die Kransteuerungsschlüsselkarten in Atomfall finden

3 Wochen vor By DDD

<🎜>: Dead Rails - wie man jede Herausforderung abschließt

4 Wochen vor By DDD

Atomfall Guide: Gegenstandsstandorte, Questführer und Tipps

4 Wochen vor By DDD

Heiße Werkzeuge

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Heiße Themen

Wo ist der Login-Zugang für Gmail-E-Mail?

7653

CakePHP-Tutorial

1393

Wie lautet das Format des Kontonamens von Steam?

Win11 -Aktivierungsschlüssel dauerhaft

NYT Mini Kreuzworträtsel Antworten

110

Related knowledge

Wie man phpmyadmin öffnet Apr 10, 2025 pm 10:51 PM

Sie können PhpMyAdmin in den folgenden Schritten öffnen: 1. Melden Sie sich beim Website -Bedienfeld an; 2. Finden und klicken Sie auf das Symbol phpmyadmin. 3. Geben Sie MySQL -Anmeldeinformationen ein; 4. Klicken Sie auf "Login".

MySQL: Eine Einführung in die beliebteste Datenbank der Welt Apr 12, 2025 am 12:18 AM

MySQL ist ein Open Source Relational Database Management -System, das hauptsächlich zum schnellen und zuverlässigen Speicher und Abrufen von Daten verwendet wird. Sein Arbeitsprinzip umfasst Kundenanfragen, Abfragebedingungen, Ausführung von Abfragen und Rückgabergebnissen. Beispiele für die Nutzung sind das Erstellen von Tabellen, das Einsetzen und Abfragen von Daten sowie erweiterte Funktionen wie Join -Operationen. Häufige Fehler umfassen SQL -Syntax, Datentypen und Berechtigungen sowie Optimierungsvorschläge umfassen die Verwendung von Indizes, optimierte Abfragen und die Partitionierung von Tabellen.

So verwenden Sie ein einzelnes Gewinde -Redis Apr 10, 2025 pm 07:12 PM

Redis verwendet eine einzelne Gewindearchitektur, um hohe Leistung, Einfachheit und Konsistenz zu bieten. Es wird E/A-Multiplexing, Ereignisschleifen, nicht blockierende E/A und gemeinsame Speicher verwendet, um die Parallelität zu verbessern, jedoch mit Einschränkungen von Gleichzeitbeschränkungen, einem einzelnen Ausfallpunkt und ungeeigneter Schreib-intensiver Workloads.

Mysqls Platz: Datenbanken und Programmierung Apr 13, 2025 am 12:18 AM

Die Position von MySQL in Datenbanken und Programmierung ist sehr wichtig. Es handelt sich um ein Open -Source -Verwaltungssystem für relationale Datenbankverwaltung, das in verschiedenen Anwendungsszenarien häufig verwendet wird. 1) MySQL bietet effiziente Datenspeicher-, Organisations- und Abruffunktionen und unterstützt Systeme für Web-, Mobil- und Unternehmensebene. 2) Es verwendet eine Client-Server-Architektur, unterstützt mehrere Speichermotoren und Indexoptimierung. 3) Zu den grundlegenden Verwendungen gehören das Erstellen von Tabellen und das Einfügen von Daten, und erweiterte Verwendungen beinhalten Multi-Table-Verknüpfungen und komplexe Abfragen. 4) Häufig gestellte Fragen wie SQL -Syntaxfehler und Leistungsprobleme können durch den Befehl erklären und langsam abfragen. 5) Die Leistungsoptimierungsmethoden umfassen die rationale Verwendung von Indizes, eine optimierte Abfrage und die Verwendung von Caches. Zu den Best Practices gehört die Verwendung von Transaktionen und vorbereiteten Staten

Warum MySQL verwenden? Vorteile und Vorteile Apr 12, 2025 am 12:17 AM

MySQL wird für seine Leistung, Zuverlässigkeit, Benutzerfreundlichkeit und Unterstützung der Gemeinschaft ausgewählt. 1.MYSQL bietet effiziente Datenspeicher- und Abruffunktionen, die mehrere Datentypen und erweiterte Abfragevorgänge unterstützen. 2. Übernehmen Sie die Architektur der Client-Server und mehrere Speichermotoren, um die Transaktion und die Abfrageoptimierung zu unterstützen. 3. Einfach zu bedienend unterstützt eine Vielzahl von Betriebssystemen und Programmiersprachen. V.

So stellen Sie eine Verbindung zur Datenbank von Apache her Apr 13, 2025 pm 01:03 PM

Apache verbindet eine Verbindung zu einer Datenbank erfordert die folgenden Schritte: Installieren Sie den Datenbanktreiber. Konfigurieren Sie die Datei web.xml, um einen Verbindungspool zu erstellen. Erstellen Sie eine JDBC -Datenquelle und geben Sie die Verbindungseinstellungen an. Verwenden Sie die JDBC -API, um über den Java -Code auf die Datenbank zuzugreifen, einschließlich Verbindungen, Erstellen von Anweisungen, Bindungsparametern, Ausführung von Abfragen oder Aktualisierungen und Verarbeitungsergebnissen.

So starten Sie MySQL von Docker Apr 15, 2025 pm 12:09 PM

Der Prozess des Startens von MySQL in Docker besteht aus den folgenden Schritten: Ziehen Sie das MySQL -Image zum Erstellen und Starten des Containers an, setzen

CentOS installieren MySQL Apr 14, 2025 pm 08:09 PM

Die Installation von MySQL auf CentOS umfasst die folgenden Schritte: Hinzufügen der entsprechenden MySQL Yum -Quelle. Führen Sie den Befehl mySQL-server aus, um den MySQL-Server zu installieren. Verwenden Sie den Befehl mySQL_SECURE_INSTALLATION, um Sicherheitseinstellungen vorzunehmen, z. B. das Festlegen des Stammbenutzerkennworts. Passen Sie die MySQL -Konfigurationsdatei nach Bedarf an. Tune MySQL -Parameter und optimieren Sie Datenbanken für die Leistung.

See all articles