!DOCTYPE?html
創(chuàng)新互聯(lián)是一家集網(wǎng)站建設(shè),壽寧企業(yè)網(wǎng)站建設(shè),壽寧品牌網(wǎng)站建設(shè),網(wǎng)站定制,壽寧網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營(yíng)銷,網(wǎng)絡(luò)優(yōu)化,壽寧網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè),幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競(jìng)爭(zhēng)力??沙浞譂M足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專業(yè)、時(shí)尚、前沿,時(shí)刻以成就客戶成長(zhǎng)自我,堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己,讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。
html
head
meta?charset="UTF-8"
title動(dòng)漫投票/title
/head
!--?這里使用了一張背景,注釋掉了。
body?style="background-image:url(body.jpeg);?background-size:100%;?background-repeat:?no-repeat;"
--
body
div?align="center"img?src="head2.jpg"?//div
div??align="center"
h4熱門動(dòng)漫投票/h4
table?id="main"?
tr?
td
input?type="radio"?name="option"?checked="checked"/貓和老鼠
/td
/tr
tr
td?style="width:550px"
div?id=0?style="background-color:#acd6ff;?width:0;?height:20px;?border-width:0px;"
/div
/td
td
label?id="label0"0/label票
/td
/tr
tr
td
input?type="radio"?name="option"??/海賊王
/td
/tr
tr?
td
div?id=1?style="background-color:#0066cc;?height:20px;?width:0;?border-width:0px;?border-color:blue;?border-style:solid?;?text-align:right;"?/div
/td
td
label?id="label1"0/label票
/td
/tr????
tr?
td
input?type="radio"?name="option"??/喜羊羊
/td
/tr
tr?
td
div?id=2?style="background-color:#ff7575;?height:20px;width:0;??border-width:0px;?border-color:blue;?border-style:solid?;?text-align:right;"?/div
/td
td
label?id="label2"0/label票
/td
/tr????
tr
td
input?type="radio"?name="option"?/其他
/td
/tr
tr?
td
div?id=3?style="background-color:#5cadad;height:20px;width:0;?border-width:0px;?border-color:blue;?border-style:solid?;?text-align:right;"?/div
/td
td
label?id="label3"0/label票
/td
/tr
tr
tdp
input?type="submit"?value="確認(rèn)投票"?onclick="vote()"/????????
/td
/tr
/table
/div
/body
script?type="text/javascript"
//在每個(gè)投票選項(xiàng)后面寫了個(gè)div,用div的寬度來代表當(dāng)前該選項(xiàng)的投票數(shù)。
function?vote(){????//函數(shù)vote,當(dāng)點(diǎn)擊確認(rèn)投票的時(shí)候,調(diào)用vote方法
//for循環(huán)的條件是,所有投票選項(xiàng)的個(gè)數(shù)。
for(var?i?=?0;?i??document.getElementsByName("option").length;?i++){
//查找到是哪個(gè)投票選項(xiàng)被選中
if(document.getElementsByName("option")[i].checked?==?true){
var?width?=?document.getElementById(i).style.width;????//獲取到當(dāng)前選項(xiàng)的寬度。
width?=?parseInt(width);//將寬度轉(zhuǎn)化為int型,因?yàn)楂@取到的width的單位是px
width?+=?3;//改變width的值,這里就是定義每次投票的進(jìn)度條的增速
document.getElementById(i).style.width?=?width+"px";//修改原div的寬度
var?label?=?"label"+i;//lable標(biāo)簽里面寫的是當(dāng)前的投票數(shù)目。
var?num?=?document.getElementById(label).innerText;//獲取到當(dāng)前的票數(shù)
document.getElementById(label).innerText?=?++num;//票數(shù)加1,并修改原值
}
}
//alert("投票成功");
}
/script
/html
---------------------?
作者:王Bob?
來源:CSDN?
原文:?
版權(quán)聲明:本文為博主原創(chuàng)文章,轉(zhuǎn)載請(qǐng)附上博文鏈接!
可以看看這個(gè)一個(gè)簡(jiǎn)單的投票系統(tǒng),可以參考下。
用第三方合作平臺(tái),將html5和頁面素材先上傳到第三方服務(wù)端,也可以在微信平臺(tái)通過文字或鏈接跳轉(zhuǎn)的形式,實(shí)現(xiàn)html5頁面的轉(zhuǎn)換。
自從微信升級(jí) X5 Blink內(nèi)核之后,兼容性大大好轉(zhuǎn)。IOS雖說沒有升級(jí)統(tǒng)一為同一版本的內(nèi)核,但I(xiàn)OS版本的微信一直是WKWebView內(nèi)核,WKWebView的版本依賴于IOS的版本。
IOS 8.0以上的系統(tǒng),對(duì)Html5和css3的支持率也很高,基本的H5,CSS3的特性均得到支持,測(cè)試中有詳細(xì)數(shù)據(jù)。
萬維網(wǎng)的核心語言、標(biāo)準(zhǔn)通用標(biāo)記語言下的一個(gè)應(yīng)用超文本標(biāo)記語言(HTML)的第五次重大修改(這是一項(xiàng)推薦標(biāo)準(zhǔn)、外語原文:W3C Recommendation、見本處參考資料原文內(nèi)容:)。
2014年10月29日,萬維網(wǎng)聯(lián)盟宣布,經(jīng)過接近8年的艱苦努力,該標(biāo)準(zhǔn)規(guī)范終于制定完成。
用application做,不知道你是否滿意,
首先在你網(wǎng)站根目錄下新建一個(gè)名為:Global.asa的文件,然后把下列代碼貼上去:
script language="vbscript" runat="server"
Sub Application_OnStart
application("yes")=0
application("no")=0
End Sub
/script
然后再建一個(gè)投票的ASP文件,內(nèi)容:
style type="text/css"
!--
.Vote {
height: 15px;
width: 200px;
border: 1px solid #0033FF;
}
#cYes {
background-color: #FF6600;
height: 15px;
width: 100px;
}
#cNo {
background-color: #FF6600;
height: 15px;
width: 100px;
}
--
/style
form action="" method="post"
br /
input name="yes" type="radio" value="yes" onclick="if (this.checked==true) no.checked=false;" /贊成br /
input name="no" type="radio" value="no" onclick="if (this.checked==true) yes.checked=false;"/反對(duì)br /
input name="投票" type="submit" value="投票" /
/form
%
nyes=0
nNo=0
'如果想重新計(jì)票,用下面四行
'application.lock()
'application("yes")=application("yes")+1
'application("no")=application("no")+1
'application.unlock()
count=application("yes")+application("no")
if count0 then
nyes=int(application("yes")*200/count)
nNo=int(application("no")*200/count)
end if
sYes=Request.form("yes")
sNo=Request.form("no")
act= Request.form("投票")
if act="投票" Then
if sYes="yes" Then
application.lock()
application("yes")=application("yes")+1
application.unlock()
Else
if sNo="no" then
application.lock()
application("no")=application("no")+1
application.unlock()
end if
End if
'圖形化顯示投票結(jié)果
count=application("yes")+application("no")
if count0 then
nyes=int(application("yes")*200/count)
nNo=int(application("no")*200/count)
end if
end if
%
贊成:%=application("yes")%票
div class="Vote" div ID="cYes" neme="cYes" style="width:%=nyes%px;"/div/div
反對(duì)::%=application("no")%票
div class="Vote" div ID="cNo" neme="cNo" style="width:%=nNo%px;"/div/div
用Cookie來記錄最后一次投票的時(shí)間,每次投票時(shí)就和當(dāng)前時(shí)間作對(duì)比,可以防止重復(fù)投票,票數(shù)也用Cookie來記錄,但只能對(duì)同一臺(tái)機(jī)器有效了。我只能給你設(shè)置和讀取Cookie的代碼,怎么用只是取決于你的業(yè)務(wù)邏輯,很簡(jiǎn)單自己實(shí)現(xiàn)吧。/*設(shè)置cookie@param cookieName -- Cookie名稱@param cookieValue -- Cookie的值*/
function setCookie(cookieName, cookieValue) {
if(cookieValue == "") {
return;
}
var date = new Date();
date.setTime(date.getTime()+1000*(60*60*24*10)); //設(shè)置cookie過期時(shí)間
document.cookie = cookieName + "=" + escape(cookieValue) + ";expires=" + date.toGMTString();
}/*根據(jù)cookie名稱讀取cookie的值@param cookieName -- Cookie名稱*/function readCookieValue(cookieName) {
var v = document.cookie;
var start1 = v.indexOf(cookieName);
if(start1 == -1) { //沒有找到對(duì)應(yīng)名稱的Cookie
return "";
}else {
var start = v.indexOf("=",start1)+1;
var end = v.indexOf(";",start);
return unescape(v.substring(start,end));
}
}