js 投票 这个心情怎么弄
如何保存投票后的数据
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>投票</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style mce_bogus="1">
.voteresult{
margin: 2px;
margin-top: 5px;
display: block;
float: left;
width: 10px;
height: 100px;
background-color: #FF0000;
overflow: hidden;
}
.style3{
background-color:#EEE;
}
</style>
<script type="text/javascript">
var total_vote = 0;
var gx_vote = 0;
var tq_vote = 0;
var wn_vote = 0;
var fn_vote = 0;
var hw_vote = 0;
var ng_vote = 0;
var xq_vote = 0;
var wx_vote = 0;
function vote(){
document.getElementById("tdiv").style.display="none";
document.getElementById("jdiv").style.display="inline";
var selectItem = 0;
var items = document.getElementsByName("item");
for(i = 0; i < items.length; i++){
if(items[i].checked){
selectItem++;
total_vote++;
switch(parseInt(items[i].value)){
case 1: gx_vote++;break;
case 2: tq_vote++;break;
case 3: wn_vote++;break;
case 4: fn_vote++;break;
case 5: hw_vote++;break;
case 6: ng_vote++;break;
case 7: xq_vote++;break;
case 8: wx_vote++;break;
}
}
}
if(selectItem <= 0){
alert("请先选择您喜欢的运动");
return;
}
var gx_num = new Number(gx_vote/total_vote);
var tq_num = new Number(tq_vote/total_vote);
var wn_num = new Number(wn_vote/total_vote);
var fn_num = new Number(fn_vote/total_vote);
var hw_num = new Number(hw_vote/total_vote);
var ng_num = new Number(ng_vote/total_vote);
var xq_num = new Number(xq_vote/total_vote);
var wx_num = new Number(wx_vote/total_vote);
alert("投票成功");
setSpanheight(gx_num, 1,total_vote);
setSpanheight(tq_num, 2,total_vote);
setSpanheight(wn_num, 3,total_vote);
setSpanheight(fn_num, 4,total_vote);
setSpanheight(hw_num, 5,total_vote);
setSpanheight(ng_num, 6,total_vote);
setSpanheight(xq_num, 7,total_vote);
setSpanheight(wx_num, 8,total_vote);
for(i = 0; i < items.length; i++){
items[i].checked = false;
}
}
//设置投票结果显示
function setSpanheight(vote_num, type,total){
var _height = new Number(100-100*vote_num);
var _span = document.getElementById("span" + type);
var _span1 = document.getElementById("span1" + type);
_span.style.height = _height.toFixed(0);
var _votea=new Number(total*vote_num)
var _percent = new Number(100*vote_num);
_span1.innerHTML = "("+_votea+")人"+_percent.toFixed(1) + "%";
}
</script>
</HEAD>
<BODY>
<div id="tdiv" style="display:inline;">
<table width="500" cellpadding="0" cellspacing="0" border="0" align="center">
<tr><td align="center" colspan="8">请选择您看到这篇新闻时的心情</td></tr>
<tr><td> </td></tr>
<tr>
<td width="50"><table width="50" cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td align="center"><img src="xinqing/face1.gif" alt="高兴"/></td>
</tr>
<tr>
<td align="center">高兴</td>
</tr>
<tr>
<td align="center"><input type="radio" name="item" value="1"></td>
</tr>
</table></td>
<td width="50"><table width="50" cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td align="center"><img src="xinqing/face2.gif" alt="同情"/></td>
</tr>
<tr>
<td align="center">同情</td>
</tr>
<tr>
<td align="center"><input type="radio" name="item" value="2"></td>
</tr>
</table></td>
<td width="50"><table width="50" cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td align="center"><img src="xinqing/face3.gif" alt="无奈"/></td>
</tr>
<tr>
<td align="center">无奈</td>
</tr>
<tr>
<td align="center"><input type="radio" name="item" value="3"></td>
</tr>
</table></td>
<td width="50"><table width="50" cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td align="center"><img src="xinqing/face4.gif" alt="愤怒"/></td>
</tr>
<tr>
<td align="center">愤怒</td>
</tr>
<tr>
<td align="center"><input type="radio" name="item" value="4"></td>
</tr>
</table></td>
<td width="50"><table width="50" cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td align="center"><img src="xinqing/face5.gif" alt="好玩"/></td>
</tr>
<tr>
<td align="center">好玩</td>
</tr>
<tr>
<td align="center"><input type="radio" name="item" value="5"></td>
</tr>
</table></td>
<td width="50"><table width="50" cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td align="center"><img src="xinqing/face6.gif" alt="难过"/></td>
</tr>
<tr>
<td align="center">难过</td>
</tr>
<tr>
<td align="center"><input type="radio" name="item" value="6"></td>
</tr>
</table></td>
<td width="50"><table width="50" cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td align="center"><img src="xinqing/face7.gif" alt="新奇"/></td>
</tr>
<tr>
<td align="center">新奇</td>
</tr>
<tr>
<td align="center"><input type="radio" name="item" value="7"></td>
</tr>
</table></td>
<td width="50"><table width="50" cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td align="center"><img src="xinqing/face8.gif" alt="温馨"/></td>
</tr>
<tr>
<td align="center">温馨</td>
</tr>
<tr>
<td align="center"><input type="radio" name="item" value="8"></td>
</tr>
</table></td>
</tr>
<tr><td align="center" colspan="8"><input type="button" value="提 交" onClick="vote();"> </td></tr>
</table>
</div>
<div id="jdiv" style="display:none;">
<table width="500" cellpadding="0" cellspacing="0" border="0" align="center" >
<tr>
<td colspan=3 align="center"><b>投票结果</b></td>
</tr>
<tr>
<td width="50">
<table width="50" cellpadding="0" cellspacing="0" border="0">
<tr>
<td><div class="voteresult"><div id="span1" class="style3" style="height:100px;" > </div></div></td>
</tr>
<tr>
<td><span id="span11">(0)人0%</span><td>
</tr>
</table>
</td>
<td width="50">
<table width="50" cellpadding="0" cellspacing="0" border="0">
<tr>
<td><div class="voteresult"><div id="span2" class="style3" style="height:100px;"> </div></div></td>
</tr>
<tr>
<td><span id="span12">(0)人0%</span><td>
</tr>
</table>
</td>
<td width="50">
<table width="50" cellpadding="0" cellspacing="0" border="0">
<tr>
<td><div class="voteresult"><div id="span3" class="style3" style="height:100px;"> </div></div></td>
</tr>
<tr>
<td><span id="span13">(0)人0%</span><td></tr>
</table></td>
<td width="50">
<table width="50" cellpadding="0" cellspacing="0" border="0">
<tr>
<td><div class="voteresult"><div id="span4" class="style3" style="height:100px;" > </div></div></td>
</tr>
<tr>
<td><span id="span14">(0)人0%</span><td>
</tr>
</table></td>
<td width="50">
<table width="50" cellpadding="0" cellspacing="0" border="0">
<tr>
<td><div class="voteresult"><div id="span5" class="style3" style="height:100px;" > </div></div></td>
</tr>
<tr>
<td><span id="span15">(0)人0%</span><td>
</tr>
</table></td>
<td width="50">
<table width="50" cellpadding="0" cellspacing="0" border="0">
<tr>
<td><div class="voteresult"><div id="span6" class="style3" style="height:100px;" > </div></div></td>
</tr>
<tr>
<td><span id="span16">(0)人0%</span><td>
</tr>
</table></td>
<td width="50">
<table width="50" cellpadding="0" cellspacing="0" border="0">
<tr>
<td><div class="voteresult"><div id="span7" class="style3" style="height:100px;" > </div></div></td>
</tr>
<tr>
<td><span id="span17">(0)人0%</span><td>
</tr>
</table></td>
<td width="50">
<table width="50" cellpadding="0" cellspacing="0" border="0">
<tr>
<td><div class="voteresult"><div id="span8" class="style3" style="height:100px;" > </div></div></td>
</tr>
<tr>
<td><span id="span18">(0)人0%</span><td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</BODY>
</HTML>