ThinkPHP 5+jQuery+MySql 투표 기능 구현

8140 단어 thinkphpmysqljquery투표 하 다.
ThinkpHP 5+jQuery+MySql 투표 기능 을 구현 하여 먼저 효과 도 를 보 여 드 리 겠 습 니 다.효과 가 좋다 고 느끼 시 면 인 스 턴 스 코드 를 참고 하 시기 바 랍 니 다.
효과 그림:

전단 코드:

<!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('',1);
  $(".redhand").click(function(){
    getdata("red",1);
  });
  $(".bluehand").click(function(){
    getdata("blue",1);
  });
});
function getdata(type,vid){
  $.ajax({
   url: "{:url('/index/vote/vote')}",
   data: {type:type,vid:vid},
   type:'POST',
   dataType: 'json',
   success: function (res) {
     console.log(res)
     if (res.status == 0) {
       alert('    ')
       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('    ');
     }
   }
  });
}
</script>
</head>
<body>
<div id="main">
  <h2 class="top_title"><a href="//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>
컨트롤 러:

<?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('post.');
    if (!empty($data)) {
      $data['ip'] = get_ip();  //  Ip
      //      ip       
      $count = model('Vote')->checkIp($data);
      //        type,           ,            
      if (!empty($data['type'])) {
        if ($count == '0') {  //        
          //          ip 
          $res = model('Vote')->postVote($data);
          if ($res) {
            //               
            $info = $this->getPercent($data);
            return return_succ($info);
          }else{
            return return_error('    ');
          }
        }else{
          //      
          return return_error('       ');
        }
      }else{
        //     ,      
        $info = $this->getPercent($data);
        return return_succ($info);
      }
    }else{
      return return_error('      ');
    }
  }
  //     
  public function getPercent($data)
  {
    //               
    $info = model('Vote')->getInfo($data);
    //        3   
    $info['red_percent'] = round($info['rednum'] / ($info['rednum'] + $info['bluenum']),3);
    $info['blue_percent'] = 1 - $info['red_percent'];
    return $info;
  }
}
모형:

<?php
namespace app\index\model;
use think\Model;
use think\Db;
class Vote extends Model
{
  //     ip       
  public function checkIp($data)
  {
    $res = Db::table('votes_ip')->where(['vid'=>$data['vid'],'ip'=>$data['ip']])->count();
    return $res;
  }
  //   
  public function postVote($data)
  {
    $info = $this->getInfo($data);
    if ($info) {
      Db::startTrans();
      try {
        if ($data['type'] == "red") {
          //       
          Db::table('votes')->where(['id'=>$data['vid']])->update(['rednum'=>$info['rednum']+1]);
        }elseif ($data['type'] == "blue") {
          Db::table('votes')->where(['id'=>$data['vid']])->update(['bluenum'=>$info['bluenum']+1]);
        }
        //       ip
        Db::table('votes_ip')->insert(['vid'=>$data['vid'],'ip'=>$data['ip']]);
        Db::commit();
        return true;
      } catch (Exception $e) {
        Db::rollback();
        return false;
      }
    }
  }
  //          
  public function getInfo($data)
  {
    //        
    $info = Db::table('votes')->where(['id'=>$data['vid']])->find();
    return $info;
  }
}
총결산
위 에서 말 한 것 은 편집장 님 께 서 소개 해 주신 씽 크 PHP 5+jQuery+MySql 투표 기능 을 실현 하 는 것 입 니 다.여러분 께 도움 이 되 셨 으 면 좋 겠 습 니 다.궁금 한 점 이 있 으 시 면 댓 글로 남 겨 주세요.편집장 님 께 서 바로 답 해 드 리 겠 습 니 다.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!
만약 당신 이 본문 이 당신 에 게 도움 이 된다 고 생각한다 면,전 재 를 환영 합 니 다.번 거 로 우 시 겠 지만 출처 를 밝 혀 주 십시오.감사합니다!
PHP 파일 분할 업로드 인 스 턴 스 코드 구현
Android 는 APK 의 기본 이름 을 어떻게 수정 합 니까?

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage