A special project related to the lucky draw and a special project for the lucky draw

A special project related to the lucky draw and a special project for the lucky draw

After the Spring Festival of 2015, I began to work hard. Recently, I made a project on the lucky draw topic, the first time I had to meet front-end requirements for the lottery.
When a user clicks the lucky draw, we first need to determine whether the user is logged on. If the user is not logged on, the user is prompted to log on and then draw the lottery, we need to determine whether a user has the permission to draw a lottery. If the number of Lottery draws is used up or the user has no permission to draw a lottery, We need to prompt the user. When the user selects a virtual prize, we need to follow the pop-up window prompts to let the user go to the background to view the relevant prizes; if the user selects the object, we need to prompt the user to enter the relevant contact address, submit the background, etc,
The implementation of the lottery function mainly references the jQuery rotate plug-in to implement the turntable rotation function.
Mainly related js

Var $ window =$ (window), prizeBox =$ ('div. prizeBox '), startTxt = $ ('. startTxt ', prizeBox), rotate1 = $ ("# rotate", prizeBox), result_list = ['ipad', 'treadmill ', 'mug', 'camera ', 'soya-bean', '50 gold coins ', 'millet cell phone', 'business notepad ']; startTxt. on ("click", function () {// click Event rotate1.trigger ("click") when the text of the turntable button is clicked ");});

Rotate1.on ('click', function (e) {e. preventDefault (); e. stopPropagation (); var login = $ ('a. login'), logout = $ ('a. logout'), url = startTxt. data ('url'), // get the leave address _ html = Response ('script.diaf'}.html (); // get the html $ of the pop-up window with several prompts. get (url, function (resp) {var _ data = $. parseJSON (resp), t = _ data. t | ''; if (t =-1) {// when the user is not logged on, log on to the dialog box. open (_ html); $ ('div. diaLogin '). removeClass ('disnone '). siblings ('div '). hide ();} Else if (t =-2) {// prompt the dialog box "dialog" when the number of user Lottery draws is used up or the user has no lottery permission. open (_ html); $ ('div. noPrize '). removeClass ('disnone '). siblings ('div '). hide ();} else if (_ data. p) {// rotate var _ rotate = 45 * _ data. p-10-Math. round (Math. random () * 25); rotate1.rotate ({duration: 5000, angle: 0, animateTo: 3600 + _ rotate, // Math. round (Math. random () * 360) + 360, callback: function () {dialog. open (_ html); if (t = 2) {// $ ('# HasPrize1 '). removeClass ('disnone '). siblings ('div '). hide (); $ ('# prizeTxt1 '). text (result_list [_ data. p-1]);} else if (t = 1) {// get the physical prize var hasPrize2 = $ ('# hasPrize2') hasPrize2.removeClass ('disnone '). siblings ('div '). hide (); $ ('# prizeTxt2 '). text (result_list [_ data. p-1]); // The Name Of The prize obtained var btn = hasPrize2.find ('. dialoginbtn3'); btn. on ('click', function (e) {// Add the corresponding harvest address information. preventDefault (); var diaFormBox = $ ('. DiaFormBox '); diaFormBox. removeClass ('disnone '). show (). siblings ('div '). hide (); $ ('# orderid '). val (_ data. id); var area3 = new Area ({target :'. area3 ', itemName: ['select province', 'select city ', 'select county/region'], items: ['province', 'city ', 'region'], callback: function (field, allFields) {field. trigger ('validate') ;}}); try {area3.fields [0]. name = 'provinceid'; area3.fields [1]. name = 'cityid'; area3.fields [2]. name = 'Areaid ';} catch (e) {}$ ("# form "). validator ({stopOnError: true, focusCleanup: true, timely: 1, showOk: false, // password verification fields: {'tel ': {rule: 'required', tip: '', OK:'', msg: {required: 'Contact number cannot be blank '}, 'address': {rule: 'required; length [2 ~ 30] ', msg: {required: 'address cannot be blank', length: 'enter 2-30 Chinese characters or characters'}, 'Contact ': {rule: 'required; length [2 ~ 20] ', msg: {required: 'Contact cannot be blank', lenght: 'enter 2-20 Chinese characters or characters'}, 'aread': {rule: 'required ', OK: '', msg: {required: 'select region' }}, // valid: function (form) {var _ form = $ (form) after verification is completed ); var _ data = _ form. serializeArray (); var _ url = _ form. attr ('action') $. post (_ url, _ data, function (res) {var _ res = $. parseJSON (res); if (_ res. t = 1) {$ ('# hasPrize3 '). removeClass ('disnone '). show (). siblings ('div '). hide () ;}}) }}) ;}} Else {alert ('network exception. Please try again later! ');}}});}});});

/*
* The following functions dynamically display the list of prize winners.
*/
Var prizeNCon = ('Div. prizeNCon ', prizeBox), ownlistul = ('Ul ', prizeNCon );
PrizeNCon. on ('mouseleave ', function (){
Var timer = setInterval (function (){
Ownlist_ul.animate ({
MarginTop: "-30px"
},500, function (){
Ownlist_ul.append (ownlist_ul.find ('li: first '));
Ownlist_ul.css ('margintop', 0 );
});
},2500 );
Ownlist_ul.data ('timer', timer );
}). Mouseleave ();
Ownlist_ul.on ('mouseenter', function (){
Var timer = ownlist_ul.data ('timer ');
Timer & clearInterval (timer );
});

When compressing and releasing Code, some compatibility problems were found during testing in ie, mainly to judge that the ie version of js is incompatible with rotate. The solution is to use
var IE = (function(){
var match = /(msie) ([\w.]+)/i.exec(navigator.userAgent);
return match&&match[1] ? parseInt(match[2]):0;
})()
Replace the original content in the rotate plug-in with this code, and ie will be compatible and available.