微信小程序實現7個(gè)彩票号碼的(de)生成
發表時(shí)間:2020-10-4
發布人(rén):融晨科技
浏覽次數:77
目标:利用微信小程序實現7個(gè)彩票号碼的(de)生成,每點擊一次按鈕,便生成一組7位号碼,而(ér)且每個(gè)彩票号碼的(de)範圍爲(wéi / wèi) 0~31,各個(gè)彩票号碼均不(bù)重複。
實現的(de)效果:
打開小程序的(de)初始界面
點擊 “生成号碼” 按鈕,便顯示出(chū)了(le/liǎo)7位符合要(yào / yāo)求的(de)彩票号碼
再次點擊 “生成号碼” 按鈕
實現代碼:
<!--index.wxml-->
<view class="box">
<view class="title">彩票号碼生成器</view>
<view class="context">
<view class="k1">{{a}}</view>
<view class="k2">{{b}}</view>
<view class="k3">{{c}}</view>
<view class="k4">{{d}}</view>
<view class="k5">{{e}}</view>
<view class="k6">{{f}}</view>
<view class="k7">{{g}}</view>
</view>
<view class="front">
有吧,前面出(chū)現的(de)人(rén),把你的(de)溫暖都耗盡了(le/liǎo),
後面出(chū)現的(de),自然吃虧些。有時(shí)候,人(rén)不(bù)願意結交新人(rén),
隻是(shì)不(bù)願意把自己的(de)過往再交代一遍。
還好,總會有一個(gè)人(rén)到(dào)處搜集你的(de)信息,聽你聽過的(de)歌,走你走過的(de)路,看你看過的(de)書,
品嘗你大(dà)呼好吃的(de)東西,隻是(shì)想彌補上(shàng)你的(de)青春和(hé / huò)過往。
</view>
<button bindtap="mysubmit">生成号碼</button>
</view>
下面是(shì)js文件的(de)實現代碼:
這(zhè)裏我是(shì)首先定義了(le/liǎo)一個(gè)數組a,我的(de)思路就(jiù)是(shì)依次循環生成7個(gè)随機數,但是(shì)要(yào / yāo)在(zài)每次生成随機數的(de)時(shí)候要(yào / yāo)進行判重,判重是(shì)要(yào / yāo)将本次生成的(de)随機數與前面生成的(de)随機數進行循環比較,如果相等則跳出(chū)内循環,然後同時(shí)将 i 減1來(lái)返回到(dào)上(shàng)一次循環。
//index.js
//獲取應用實例
var a = new Array();
var b;
Page({
mysubmit: function () {
b = parseInt(Math.random() * 32);/*首先生成第一個(gè)彩票号碼*/
a[0] = b;
for (var i = 1; i < 7; i++) { /*循環判斷*/
b = parseInt(Math.random() * 32);
a[i] = b;
for (var j = 0; j < i; j++) {/*每生成一個(gè)彩票号碼就(jiù)與前面生成的(de)彩票号碼相比較*/
if (a[j] == a[i]) { /*如果相等,将 i-1 ,跳出(chū)内層循環後 i++,重新定位到(dào)i*/
i = i-1;/**/
break;
}
}
}
this.setData({
a:(a[0]/Math.pow(10,2)).toFixed(2).substr(2),/*生成兩位數彩票号碼,如果号碼>=0且<=9,則在(zài)該數前面補一個(gè)0,例如"07"*/
b:(a[1]/Math.pow(10,2)).toFixed(2).substr(2),
c:(a[2]/Math.pow(10,2)).toFixed(2).substr(2),
d:(a[3]/Math.pow(10,2)).toFixed(2).substr(2),
e:(a[4]/Math.pow(10,2)).toFixed(2).substr(2),
f:(a[5]/Math.pow(10,2)).toFixed(2).substr(2),
g:(a[6]/Math.pow(10,2)).toFixed(2).substr(2),
})
}
})
wxss文件:
/**index.wxss**/
.context{
display: flex;
text-align: center;
line-height: 100rpx;
font-weight: bolder;
color: aliceblue;
}
.k1{
flex-grow: 1;
background-color: rgb(224, 57, 57);
border-radius: 50px;
}
.k2{
flex-grow: 1;
background-color: rgb(226, 124, 8);
border-radius: 50px;
}
.k3{
flex-grow: 1;
background-color: rgb(248, 206, 0);
border-radius: 50px;
}
.k4{
flex-grow: 1;
background-color: rgb(53, 230, 56);
border-radius: 50px;
}
.k5{
flex-grow: 1;
background-color: rgb(52, 84, 201);
border-radius: 50px;
}
.k6{
flex-grow: 1;
background-color: rgb(65, 0, 152);
border-radius: 50px;
}
.k7{
flex-grow: 1;
background-color: rgb(89, 33, 127);
border-radius: 50px;
}
button{
background-color: rgb(6, 248, 139);
}
.front{
margin-top:30px ;
margin-bottom: 30px;
font-size: larger;
}