分两个页面，要点：提交form 相连action method  两个页面可以合成一个页面action传到自身页面   但分开较清晰

第一个页面vote.php

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>投票</title>

 <style type="text/css">

 *

 {

     margin:0px auto;

     padding:0px;

     }

 h3

 {

     margin:10px;

     }

 .diyiceng

 {

     height:220px;

     width:200px;

     background-color:#FFF;

     position:absolute;

     visibility:visible;

     left:10px;

     top:40px;

     }

 .dierceng

 {

     height:220px;

     width:800px;

     background-color:#FFF;

     position:absolute;

     visibility:hidden;

     left:0px;

     top:0px;

     }

 .xuanxiang

 {

     position:absolute;

     }

 .jindu

 {

     width:200px;

     height:10px;

     position:absolute;

     left:100px;

     border:solid #999 1px;

     }

 .jindutiao

 {

     height:8px;

     position:absolute;

     background-color:#0F0;

     border:solid 1px #00FF00;

     }

 .shuzi

 {

     position:absolute;

     left:320px;

     }

 .baifenbi

 {

     position:absolute;

     left:350px;

     }

 </style>

 </head>

 <body>

 <h3>35岁发展方向</h3>

 <div class="diyiceng" id="diyiceng">

 <form action="votechuli.php" method="post">

 <?php

     $db=new mysqli("localhost","root","123","test2");

     !mysqli_connect_error()or die("连接错误");

         $sql="select * from DiaoYanXuanXiang";

         $resulttp=$db->query($sql);

         while($row = $resulttp->fetch_row())

         {   //print_r($row);

             echo "<div><input type='checkbox' name='test[]' value='".$row[0]."'/>".$row[1]."</div><br />";

         }

 ?>

 <input type="submit" name="submit" value="提交" />&nbsp;&nbsp;

 <input type="button" name="chakan" value="查看结果" onclick="xianshi()"/>

 </form>

 <?php

 $db=new mysqli("localhost","root","123","test2");

 !mysqli_connect_error()or die("连接错误");

     $sql="select * from DiaoYanXuanXiang";

     $result=$db->query($sql);

 echo "<div class='dierceng' id='yincang'>";

 echo "<form>";

     $sqlsum = "select SUM(numbers) from DiaoYanXuanXiang";

     $resultsum = $db->query($sqlsum);

     $aa = $resultsum->fetch_row();

     $zongshu = $aa[0];

     while($rowjg = $result->fetch_row())

     {

         $xuanxiang = $rowjg[1];

         $shuliang = $rowjg[2];

         $baifenbi = $shuliang/$zongshu*100;

         $baifenbi1=round($baifenbi,1);//对小数取一位

         echo "<div><div class='xuanxiang'>".$xuanxiang."</div>

         <div class='jindu'><div class='jindutiao' style='width:".$baifenbi."%'></div></div>

         <div class='shuzi'>".$shuliang."</div>

         <div class='baifenbi'>".$baifenbi1."%</div></div><br /><br />";

     }

 echo "<input type='button' name='fanhui' value='返回' onclick='buxianshi()' />";

 echo "</form>";

 echo "</div></div>";

 ?>

 </body>

 </html>

 <script>

 function xianshi()

 {

    var a=document.getElementById("yincang");

    if(a.style.visibility="hidden")

    {

        a.style.visibility="visible";

    }

 }

 function buxianshi()

 {

    var a=document.getElementById("yincang");

    if(a.style.visibility="visible")

    {

        a.style.visibility="hidden";

    }

 }

 </script>

效果图：

第二个页面

votechuli.php

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>无标题文档</title>

 </head>

 <body>

 <?php

 $test=$_POST["test"];

 //1.造连接对象

 $db=new mysqli("localhost","root","123","test2");

 //2.判断是否连接成功

 !mysqli_connect_error()or die("连接失败");

         for($i=0;$i<count($test);$i++)

       {

         $sql="update DiaoYanXuanXiang set numbers=numbers+1 where ids='".$test[$i]."'";

         $result=$db->query($sql);//为什么query后要加（$sql,0）1代表增删改 变化的一面  0代表 查询 不变的一面

       }

         //判断是否修改成功

         if($result)

         {

             header("Location:vote.php");

             }

             else

             {

                 echo "修改失败！";

                 }

 ?>

 </body>

 </html>

效果图：

2016/3/30 ①投票checkbox ②进度条两个div套起百分比控制内div（width） <div><div></div></div> ③数据库test2 表 diaoyan... 35岁发展方向投票的更多相关文章

  1. ionic 横向滚动 ion-scroll 进度条（步骤）// 根据后台数据控制当前默认滑动到的位置

    <ion-scroll zooming="false" direction="x" style="width: 100%;" scro ...

  2. Android 自学之进度条ProgressBar

    进度条(ProgressBar)也是UI界面中的一种非常使用的组件,通常用于向用户显示某个耗时完成的百分比.因此进度条可以动态的显示进度,因此避免长时间地执行某个耗时操作时,让用户感觉程序失去了响应, ...

  3. Android 自定义view --圆形百分比（进度条）

    转载请注明出处:http://blog.csdn.net/wingichoy/article/details/50334595 注:本文由于是在学习过程中写的,存在大量问题(overdraw onDr ...

  4. android多线程进度条

    多线程实现更新android进度条. 实例教程,详细信息我已经注释   android多线程进度条   01package com.shougao.hello; 02 03import android ...

  5. QT中可以用QProgressBar或着QProgressDialog来实现进度条

    QProgressBar的使用 首先在designer中拖一个按钮和进度条部件,按下面初始化 //补充:下面两句写在MainWindow的构造函数里进行初始化 ui->progressBar-& ...

  6. 制作进度条(UISlider)

    怎样判断是否应当使用进度条 用进度条的主要目的是为了用一根管子的充满程度来直观地表示某种数值的百分比,进度条分为可拖动和不可拖动两种. 可拖动进度条和不可拖动进度条的原理几乎是一模一样,唯一的区别是可 ...

  7. JQuery UI进度条——Progressbar

    1.先引入jquery和jquery-ui的js,例子如下: <link href="JqueryUI/jquery-ui.css" rel="stylesheet ...

  8. QT中进度条的使用

    在QT中可以用QProgressBar或着QProgressDialog来实现进度条. QProgressBar的使用 首先在designer中拖一个按钮和进度条部件,按下面初始化 //补充:下面两句 ...

  9. 进度条（ProgressBar）的功能与用法

    进度条也是UI界面中一种非常实用的组件,通常用于向用户显示某个耗时操作完成的的百分比.进度条可以动态的显示进度,因此避免长时间的执行某个耗时的操作,让用户感觉程序失去了响应,从而更好的提高用户界面的友 ...

随机推荐

  1. 条款30：透彻了解inline的里里外外（understand the ins and outs of inlining）

    NOTE: 1.将大多数inline限制在小型 被频繁调用的函数身上.这可使日后的调试过程和二进制升级(binary upgradability)更容易,也可使潜在的代码膨胀问题最小化, 使程序的速度 ...

  2. 剑指Offer（书）：斐波那契数列

    题目:大家都知道斐波那契数列,现在要求输入一个整数n,请你输出斐波那契数列的第n项(从0开始,第0项为0).n<=39 分析:第一种方法:递归,45时,时间为5s,50时,我就等不及了.原因是重 ...

  3. 77. Spring Boot Use Thymeleaf 3【从零开始学Spring Boot】

    [原创文章,转载请注明出处] Spring Boot默认选择的Thymeleaf是2.0版本的,那么如果我们就想要使用3.0版本或者说指定版本呢,那么怎么操作呢?在这里要说明下 3.0的配置在spri ...

  4. JS Enter键跳转 控件获得焦点

    //回车跳转 jQuery(document).ready(function () { //$(':input:text:first').focus(); jQuery(':input:enabled ...

  5. Linux基础之vi编辑器（二）

    vi 编辑器 man vim 一 打开文件,定义光标 vi +# test       打开文件,定位于#行.vi + test        打开test文件,定位于最后一行.vi +/patter ...

  6. Vim enhance part1

    NO1 .认识.命令 例 删除man.config中第1到30行的注释 1.光标移到#上,按下x删除 2.按下j将光标移到第二行#上,之后按下. 3.可以看到第2行的#也被删除了因为.就是重复上次命令 ...

  7. loadrunner 多用户并发操作解读

    假设存在: 数据:A.B.C 虚拟用户:Vuser1.Vuser2.Vuser3 脚本中参数出现三次,脚本迭代三次 怎样取下一行数据? Sequential:顺序,所有虚拟用户按照顺序读取数据表 Ra ...

  8. POJ3150：Cellular Automaton

    题意看不懂加题目想不通,很菜. n<=500个数围城环,每次操作对每个数Ai把与i在环上相距不超过d<n/2(包括Ai)的数加起来取模m<=1e6,求K<=1e7次操作后的环. ...

  9. hdu - 5007 Post Robot (水题)

    http://acm.hdu.edu.cn/showproblem.php?pid=5007 #include<iostream> #include<stdio.h> #inc ...

  10. SQL SERVER 2008破解加密存储过程（修正存储过程过长解密出来是空白的问题）

    SQLServer2005里使用with encryption选项创建的存储过程仍然和sqlserver2000里一样,都是使用XOR进行了的加密.和2000不一样的是,在2005的系统表syscom ...