基于射流研究…实现投票的实例代码

本文实例讲述了Java脚本语言实现三种投票方式的实现方法，分享给大家供大家参考。具体如下：

一、js柱状投票图效果图：

实现代码：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。org/TR/XHTML 1/DTD/XHTML 1-Transitional。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' hearteta http-equiv=' Content-Type ' Content=' text/html；charset=gb2312' /titlejs柱状投票图/title style type=' text/CSS ' body { font-weight : bold；color : # ffffont-size :16 px；字体系列Helvetica阿里亚尔：无衬线；背景-颜色： # 000000；}.朱{保证金-最高：100 px宽度宽度：420像素位置：相对；}.良好{宽度：200像素位置：绝对；底部：0;左转：0文本对齐：居中；背景-颜色： # f00高度：50 px}.错误的{宽度：200像素位置：绝对；底部：0;右：0文本对齐：居中；背景色： # 009900;高度：50 px}.和{}/stylescript类型='text/javascript'//innerHTML属性设置或返回表格行的开始和结束标签之间的超文本标记语言。//值属性可设置或返回单选按钮的价值属性的值。//所有钢性铸铁在数字正射影像图结构里面都是字符型的没有数字型的函数tou Piao(){ var good=parsent(文档。选票。很好。值)；var bad=ParSeint(文档。选票。bad _ num。值)；var sum=好的坏的；var sum _ g=数学。圆形(好/总和* 100)；var sum _ b=数学。回合(不良/总和* 100)；document.getElementByIdx_x_x_x('和')。innerHTML='总数为：' sum '票；文件。getelementbyidx _ x _ x _ x(' g ').innerHTML='好评sum _ g " %文件。getelementbyidx _ x _ x _ x(' b ').innerHTML='差评： " sum _ b " %文件。getelementbyidx _ x _ x _ x(' g ')。风格。高度=sum _ g ' px文件。getelementbyidx _ x _ x _ x(' g ')。风格。margin top=(sum _ g-100)“px”；文件。getelementbyidx _ x _ x _ x(' b ')。风格。高度=sum _ b ' px文件。getelementbyidx _ x _ x _ x(' b ')。风格。margin top=(sum _ B- 100)“px”；}/script/head dy form action=' method=' get ' name=' ballot '好评票数：输入名称='good_num '类型='text' /br /差评票数：输入名称='bad_num '类型=' text '/br/输入名称='bt '类型='按钮'值='提交onclick=' TouPiao()'//formdiv class=' Zhu ' div class=' good ' id=' g '好评50%/divdiv class='bad' id='b '差评50%/div/divdiv class='和id='和'总数为0票/div/body/html

二、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=' MCE : style！- .voteresult { margin: 2px边距-top : 5px；显示器：块；向左浮动：宽度： 250像素；高度： 10px背景色： # EEE；飞越：隐藏；} .样式3 {底色： # 66666；}-/MCE :样式MCE _ push=' 1 ' .voteresult { margin: 2px边距-top : 5px；显示器：块；向左浮动：宽度： 250像素；高度： 10px背景色： # EEE；飞越：隐藏；} .样式3 {底色： # 66666；}/style MCE :脚本类型=' text/JavaScript '！-var total _ vote=0；var LQ _ vote=0；var zq _ vote=0；var ppq _ vote=0；函数vote(){ var selectItem=0；var items=文档。getelementsbyname(' item ')；for(I=0；一。项目。长度；i ){ if(items[i]).选中){ selectItemtotal _ votesswitch(Parseint(items[I]).值)){案例1: LQ _投票；打破；案例2: zq _ vote打破；案例3: ppq _ vote打破；} } } if(selectItem=0){ alert('请先选择您喜欢的运动');返回；} var LQ _ num=new Number(LQ _投票/total _投票)；var zq_num=新数字(zq _ vote/total _ vote)；var ppq_num=新数字(ppq _ vote/total _ vote)；警报('投票成功');setSpanWidth(lq_num，1)；setSpanWidth(zq_num，2)；setSpanWidth(ppq_num，3)；for(I=0；一。项目。长度；i ){ items[i].选中=假；} } //设置投票结果显示函数setspangwidth(vote _ num，type){ var _ width=new Number(250 * vote _ num)；var _ span=文档。getelementbyidx _ x _ x _ x(' span '类型);var _ span 1=文档。getelementbyidx _ x _ x _ x(' span 1 '类型);//alert(_ span。风格。宽度)；_ span。风格。width=_ width。to fixed(0)；var _percent=新数字(100 *投票数);_ span 1。innerhtml=_ percent。to fixed(1)“%”；}//////MCE :脚本/HEAD BOdy你喜欢的运动：br篮球输入类型='复选框'名称='item '值='1 '足球输入类型='复选框'名称='item '值='2 '乒乓球输入类型='复选框'名称='item '值='3' br输入类型='按钮'值='提交onclick=' vote()；br br表tr td colspan=3投票结果TD/tr/tr篮球/TD tddiv class=' voteresult ' span id=' span 1 ' class=' style 3 ' style=' width : 0px；'/span/div/TD TD span id=' span 11 ' 0%/span TD/tr TD足球/TD tddiv class=' voteresult ' span id=' span 2 ' class=' style 3 ' style=' width : 0px；/span/div/TD TD span id=' span 12 ' 0%/span TD/tr TD乒乓球/TD tddiv class=' voteresult ' span id=' span 3 ' class=' style 3 ' style=' width : 0px；/span/div/TD TD span id=' span 13 ' 0%/span TD/tr/table/BOdy/HTML三、投票效果图：

实现代码：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。org/TR/XHTML 1/DTD/XHTML 1-Transitional。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' hearteta http-equiv=' Content-Type ' Content=' text/html；字符集=GB 2312/标题无标题文档/title style type=' text/CSS ' body { font-size :12 px；}/style脚本语言=' JavaScript '函数add(txt){ var ABC=document。getelementbyidx _ x(' ABC ')；ABC。innerHTMl=parsent(ABC。innerHTMl)1；}/script/head dytable width=' 50 ' height=' 50 ' border=' 1 '单元格填充=' 0 '单元格间距=' 0 ' tr TD align=' center ' val ign=' middle ' div id=' ABC ' 0/div/TD/tr TD align=' center ' val ign=' middle ' a href=' # ' onclick=' add(1)'投一票/a/td /tr/table/body/html以上就是本文的全部内容，希望对大家的学习有所帮助。