小程序实现投票进度条

本文实例为大家分享了小程序投票进度条的具体代码，供大家参考，具体内容如下

我们提供的服务有：成都网站设计、成都做网站、外贸网站建设、微信公众号开发、网站优化、网站认证、崆峒ssl等。为1000多家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务，是有科学管理、有技术的崆峒网站制作公司

示例图：

小程序实现投票进度条

上代码：

index.wxml:


 
 
 进度
 {{width}}
 
 当前票数
 {{quorumvotes}}

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,//当前票数
 width: "0%",//投票进度
 votes: 500 //最多可投票数
 },
 
 onLoad: function() {
 //获取总票数
 var votes = this.data.votes;
 //获取当前票数
 var quorumvotes = this.data.quorumvotes;
 //进度
 var speed = quorumvotes/votes*100+"%";
 console.log(speed)
 this.setData({
 width: speed,
 });
 
})

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持创新互联。

本文标题：小程序实现投票进度条
本文链接：http://myzitong.com/article/jeehgc.html

小程序实现投票进度条

其他资讯