公司項目搞優惠活動，讓做一個轉盤抽獎的活動，轉盤抽獎讓他轉起來 按照概率停止其實都麻煩，但是概率如果設置在前端就會很大的安全漏洞，所以無論為了安全性還是后期的維護問題都要把概率寫到后台配置里然后讀取配置。那么問題來了，我們需要把后台的概率結果和前端自己的轉盤想對應，我的大致思路是這樣的，后台返回概率結果之后，對應的可定有獎品，然后給每個獎品一個不變的標識，根據這個返回的標識我們前端進行相應的轉盤指針停留的位置。我們后台鼻尖懶 他不想改接口了 就直接讓我去對應配置里的獎品名字，好吧就這樣算是搞完了。
var myDraw;//點擊轉盤方法名
var $btn = $('.turntableBox');
$('#playnum').html(playnum);
var isture = false;
var myPriceName;
var prizeValue;
if(isture == true){
$('.turntableBox').unbind("touchend",myDraw);
}else{
$('.turntableBox').bind("touchend",myDraw);
}
function zhuanpan(){
$.ajax({
type:"post",
url: "",
async:false,
data:{
account:account,
userType:userType
},
beforeSend:function(){
$('.turntableBox').unbind("touchend",myDraw);
},
success:function(data){
console.log(data);
myPriceName = data.data.prizeName;
prizeValue = data.data.prizeValue;//產品價值
localStorage.setItem("prizeValue",prizeValue);
},error:function(XMLHttpRequest, textStatus, errorThrown){
alert("轉盤-"+XMLHttpRequest.status);
alert("轉盤-"+XMLHttpRequest.readyState);
alert("轉盤-"+textStatus);
},
complete:function(){
$('.turntableBox').bind("touchend",myDraw);
}
});
}
var clickfunc = function() {
zhuanpan();
var data = myPriceName;
if(data == '0'){
rotateFunc(18, '恭喜您獲得0');
setTimeout(hongbao,6000)
}
if(data == '1'){
rotateFunc(54, '恭喜您獲得1');
}
if(data == '2'){
rotateFunc(90, '恭喜您獲得2!');
}
if(data == '3'){
rotateFunc(126, '恭喜您獲得3!');
}
if(data == '4'){
rotateFunc(162, '恭喜您獲得4');
}
if(data == '5'){
rotateFunc(198, '恭喜您獲得5!');
}
if(data == '6'){
rotateFunc(234, '恭喜您獲得6!');
}
if(data == '7'){
rotateFunc(270, '恭喜您獲得7!');
}
if(data == '8'){
rotateFunc(306, '恭喜您獲得8!');
}
if(data == '9'){
rotateFunc(342, '9!');
}
}
$btn.bind('touchend',myDraw =function(){
shareTimes();//抽獎次數
if(isture) return; // 如果在執行就退出
isture = true; // 標志為 在執行
//先判斷是否登錄,未登錄則執行下面的函數
if(1 == 2) {
$('#playnum').html('0');
alert("請先登錄");
isture = false;
} else { //登錄了就執行下面
if(playnum <= 0) { //當抽獎次數為0的時候執行
// alert("對不起，您沒有次數了!");
$('.myAlert').html('對不起，您沒有抽獎次數！').show ().delay (1000).fadeOut ();
$('#playnum').html(0);
isture = false;
} else { //還有次數就執行
// $('.turntableBox').bind("touchend",myDraw);
playnum = playnum - 1; //執行轉盤了則次數減1
if(playnum <= 0) {
playnum = 0;
}
$('#playnum').html(playnum);
clickfunc();
}
}
});
var rotateFunc = function(angle, text){
isture = true;
$btn.stopRotate();
$btn.rotate({
angle: 10,
duration: 1500, //旋轉時間
animateTo: angle + 1080, //讓它根據得出來的結果加上1080度旋轉
callback: function() {
isture = false; // 標志為 執行完畢
$('.myAlert').html(text).show ().delay (1500).fadeOut ();
}
});
};
}
在這個程序員苦逼的年代里我們需要抱團取暖