Company election, I plan to create an html to count votes, please help! _html/css

Company election, I plan to create an html to count votes, please help! _html/css_WEB-ITnose

WBOY

Release： 2016-06-24 12:06:11

Original

1420 people have browsed it

<!doctype html><html>	<head>		<meta charset="utf-8">		<title>无标题文档</title>        <style type="text/css">		*	{text-align: center;}		p	{font: 30px;}		table {border: 1px #000 solid; line-height: 30px;}		tr,th,td  {border: 1px #000 solid; height: 30px; width: 80px;}		input {line-height: 30px; width: 60px; margin-top: 5px;}		</style>	</head>	<body>    	<p>选举大会</p>        <table>        	<tr>            	<th>姓名</th>                <th>当前票数</th>                <th>加一</th>            </tr>            <tr>            	<td>一号</td>                <td>0</td>                <td><input type="submit" value="加" /></td>            </tr>            <tr>                <td>二号</td>                <td>0</td>                <td><input type="submit" value="加" /></td>            <tr>                <td>三号</td>                <td>0</td>                <td><input type="submit" value="加" /></td>			</tr>            <tr>            	<td>四号</td>                <td>0</td>                <td><input type="submit" value="加" /></td>            </tr>                        </table>    </body></html>

Copy after login

If you want to press the "Add" button at the back, the "current number of votes" will be increased by 1. What should I do? ?

Reply to the discussion (solution)

Let’s give a soy sauce LS answer

It’s very simple, write ajax on the server side Interface, the client adjusts it when clicked, and the number of votes is updated in the callback function. Please pay attention to the verification code function, otherwise it will be easy to swipe votes.

It is very simple. The ajax interface is written on the server side. , the client adjusts it when clicked, and the number of votes is updated in the callback function. Please pay attention to the verification code function, otherwise it will be easy to swipe votes

. There is no need to upload the server, just use it locally, and mark the remaining ones. And the trouble of statistics, so that the number of votes can be seen at a glance, can it be achieved with JS?

If what you want to do is record-keeping, you can consider using cookies to store several specific values

<!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">        *    {text-align: center;}        p    {font: 30px;}        table {border: 1px #000 solid; line-height: 30px;}        tr,th,td  {border: 1px #000 solid; height: 30px; width: 80px;}        input {line-height: 30px; width: 60px; margin-top: 5px;}        </style>        <script src="http://festatic.aliapp.com/js/jquery/1.11.0/jquery.min.js"></script>        <script>		$(function(){			$('.add').click(function(){				var countTd=$(this).parent().prev();				var countCur=(parseInt(countTd.html())||0)+1;				countTd.html(countCur);			});					})        </script>    </head>    <body>        <p>选举大会</p>        <table>            <tr>                <th>姓名</th>                <th>当前票数</th>                <th>加一</th>            </tr>            <tr>                <td>一号</td>                <td>0</td>                <td><input type="submit" value="加"  class="add"/></td>            </tr>            <tr>                <td>二号</td>                <td>0</td>                <td><input type="submit" value="加" class="add"/></td>            <tr>                <td>三号</td>                <td>0</td>                <td><input type="submit" value="加" class="add"/></td>            </tr>            <tr>                <td>四号</td>                <td>0</td>                <td><input type="submit" value="加" class="add"/></td>            </tr>                        </table>    </body></html>

Copy after login

If you want to do it record-keeping, Then you can consider using cookies to store several specific values

<!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">        *    {text-align: center;}        p    {font: 30px;}        table {border: 1px #000 solid; line-height: 30px;}        tr,th,td  {border: 1px #000 solid; height: 30px; width: 80px;}        input {line-height: 30px; width: 60px; margin-top: 5px;}        </style>        <script src="http://festatic.aliapp.com/js/jquery/1.11.0/jquery.min.js"></script>        <script>		$(function(){			$('.add').click(function(){				var countTd=$(this).parent().prev();				var countCur=(parseInt(countTd.html())||0)+1;				countTd.html(countCur);			});					})        </script>    </head>    <body>        <p>选举大会</p>        <table>            <tr>                <th>姓名</th>                <th>当前票数</th>                <th>加一</th>            </tr>            <tr>                <td>一号</td>                <td>0</td>                <td><input type="submit" value="加"  class="add"/></td>            </tr>            <tr>                <td>二号</td>                <td>0</td>                <td><input type="submit" value="加" class="add"/></td>            <tr>                <td>三号</td>                <td>0</td>                <td><input type="submit" value="加" class="add"/></td>            </tr>            <tr>                <td>四号</td>                <td>0</td>                <td><input type="submit" value="加" class="add"/></td>            </tr>                        </table>    </body></html>

Copy after login

Thank you very much! !