小程序?qū)崿F(xiàn)投票進(jìn)度條
更新時(shí)間：2019年11月20日 11:58:19 作者：句點(diǎn)_a
這篇文章主要為大家詳細(xì)介紹了小程序?qū)崿F(xiàn)投票進(jìn)度條，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
本文實(shí)例為大家分享了小程序投票進(jìn)度條的具體代碼，供大家參考，具體內(nèi)容如下
示例圖：
上代碼：
index.wxml:
<view class='clo_jdt'>
<view style='width:{{width}}'></view>
</view>
<view>進(jìn)度
<text>{{width}}</text>
</view>
<view>當(dāng)前票數(shù)
<text>{{quorumvotes}}</text>
</view>
index.wxss
.clo_jdt {
width: 100%;
border: 1px solid #6c9c2c;
height: 25px;
border-radius: 10px;
}
.clo_jdt view {
background: #95ca0d;
float: left;
height: 100%;
text-align: center;
line-height: 150%;
border-radius: 10px 0 0 10px;
}
index.js
Page({
data: {
quorumvotes: 50,//當(dāng)前票數(shù)
width: "0%",//投票進(jìn)度
votes: 500 //最多可投票數(shù)
},
onLoad: function() {
//獲取總票數(shù)
var votes = this.data.votes;
//獲取當(dāng)前票數(shù)
var quorumvotes = this.data.quorumvotes;
//進(jìn)度
var speed = quorumvotes/votes*100+"%";
console.log(speed)
this.setData({
width: speed,
});
})
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:
- 微信小程序自定義組件實(shí)現(xiàn)環(huán)形進(jìn)度條
- 微信小程序?qū)崿F(xiàn)圓形進(jìn)度條動(dòng)畫(huà)
- 小程序視頻或音頻自定義可拖拽進(jìn)度條的示例代碼
- 微信小程序自定義音樂(lè)進(jìn)度條的實(shí)例代碼
- 微信小程序多音頻播放進(jìn)度條問(wèn)題
- 微信小程序畫(huà)布圓形進(jìn)度條顯示效果
- 微信小程序之圓形進(jìn)度條實(shí)現(xiàn)思路
- 微信小程序?qū)崿F(xiàn)下載進(jìn)度條的方法
- 微信小程序?qū)崿F(xiàn)實(shí)時(shí)圓形進(jìn)度條的方法示例
- 詳解微信小程序——自定義圓形進(jìn)度條
相關(guān)文章
JS+CSS實(shí)現(xiàn)彈出全屏灰黑色透明遮罩效果的方法
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)彈出全屏灰黑色透明遮罩效果的方法,詳細(xì)分析了彈出遮罩層效果的實(shí)現(xiàn)方法以及完整的實(shí)例代碼,需要的朋友可以參考下2014-12-12
這篇文章主要為大家分享了js窗口震動(dòng)小程序,可設(shè)置抖動(dòng)的頻率，范圍，和次數(shù)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11
經(jīng)典的解除許多網(wǎng)站無(wú)法復(fù)制文字的絕招
經(jīng)典的解除許多網(wǎng)站無(wú)法復(fù)制文字的絕招...2006-12-12
點(diǎn)擊顯示指定元素并隱藏其他同輩元素，下面有個(gè)不錯(cuò)的方法,需要的朋友可以參考下2014-02-02
JavaScript使用prototype屬性實(shí)現(xiàn)繼承操作示例
這篇文章主要介紹了JavaScript使用prototype屬性實(shí)現(xiàn)繼承操作,結(jié)合實(shí)例形式詳細(xì)分析了JavaScript使用prototype屬性實(shí)現(xiàn)繼承的相關(guān)原理、實(shí)現(xiàn)方法與操作注意事項(xiàng),需要的朋友可以參考下2020-05-05
這篇文章主要介紹了詳解javascript中的babel到底是什么，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-06-06
ZeroClipboard插件實(shí)現(xiàn)多瀏覽器復(fù)制功能(支持firefox、chrome、ie6)
Zero Clipboard 利用透明的Flash讓其漂浮在復(fù)制按鈕之上，這樣其實(shí)點(diǎn)擊的不是按鈕而是Flash ，這樣將需要的內(nèi)容傳入Flash，再通過(guò)Flash的復(fù)制功能把傳入的內(nèi)容復(fù)制到剪貼板2014-08-08
一個(gè)效果寫(xiě)的HashTable代碼...2007-03-03
JavaScript實(shí)現(xiàn)查找字符串中第一個(gè)不重復(fù)的字符
這篇文章主要介紹了JavaScript實(shí)現(xiàn)查找字符串中第一個(gè)不重復(fù)的字符,需要的朋友可以參考下2014-12-12
javascripit實(shí)現(xiàn)密碼強(qiáng)度檢測(cè)代碼分享
這篇文章主要介紹了javascripit實(shí)現(xiàn)密碼強(qiáng)度檢測(cè)，大家參考使用吧2013-12-12