PHP+Ajax结合lottery.js制作的一款微信手机端九宫格抽奖实例,抽奖完成后有收货地址添加表单出现。支持可以设置中奖概率等。

奖品列表

 <div class="lottery_list clearfix" id="lottery">
<ul>
<li class="lottery-unit lottery-unit-0 lottery-1"><img src="data:images/1.png"></li>
<li class="lottery-unit lottery-unit-1 lottery-2"><img src="data:images/2.png"></li>
<li class="lottery-unit lottery-unit-2 lottery-3"><img src="data:images/3.png"></li>
<li class="lottery-unit lottery-unit-7 lottery-4"><img src="data:images/4.png"></li> <li><a href="javascript:void(0);"><img src="data:images/middle.jpg"></a></li> <li class="lottery-unit lottery-unit-3 lottery-5"><img src="data:images/5.png"></li>
<li class="lottery-unit lottery-unit-6 lottery-6"><img src="data:images/6.png"></li>
<li class="lottery-unit lottery-unit-5 lottery-7"><img src="data:images/7.png"></li>
<li class="lottery-unit lottery-unit-4 lottery-8"><img src="data:images/8.png"></li>
</ul>
</div>

Ajax抽奖

 $.post("ajax.php", function(data) { //获取奖品,也可以在这里判断是否登陆状态
if (data.prize_id != '' && data.prize_id != undefined) {
var prize_site = $(".lottery-" + data.prize_id).attr("data-ord");
$("#lottery").attr("prize_site", prize_site);
$("#lottery").attr("prize_id", data.prize_id);
$("#lottery").attr("prize_name", data.prize_name);
$("#lottery").attr("prize_pic", data.prize_pic);
if (data.code == 200) {
$("#lottery").attr("contact_name", data.contact_name);
$("#lottery").attr("contact_mobile", data.contact_mobile);
$("#lottery").attr("contact_addr", data.contact_addr);
}
roll();
click = true;
return false;
} else {
showLotteryTip(data.error);
} }, "json")

保存收货地址

 $.post("ajax.php", {contact_name: contact_name, contact_mobile: contact_mobile, contact_addr: contact_addr}, function(data) {
$("#lottery_addr_box").modal('hide');
if (data.code == 200) {
$("#tip_words").html("提交成功!");
getModalBox('#lottery_tip');
} else {
showLotteryTip(data.error);
}
}, "json")

本文转自:https://www.sucaihuo.com/php/519.html 转载请注明出处!

PHP+Ajax微信手机端九宫格抽奖实例的更多相关文章

  1. js仿手机端九宫格登录功能

    js仿手机端九宫格登录功能 最近闲来无事把以前无聊时开发的小东西拿出来和大家分享下,写的不好的请指出,我会及时修改.谢谢. 功能及方法逻辑都注释在代码中.所以麻烦大家直接看代码. 效果如下: 话不多说 ...

  2. php+lottery.js制作九宫格抽奖实例

    php+lottery.js制作九宫格抽奖实例,本抽奖功能效果表现好,定制方便简单,新手学习跟直接拿来用都非常不错,兼容IE.火狐.谷歌等浏览器. 引入抽奖插件lottery.js <scrip ...

  3. 【实战问题】【4】Vue写的页面在微信手机端和微信web开发者工具中都能正常显示,但是在微信pc端上显示空白

    原因:pc端微信浏览器不支持es6,而代码中使用了 let . 解决:将 let 改为 var(若使用 es6 语法比较多,可以进行转换,将 es6 语法转为 es5) 参考博客: 1,h5微信页面在 ...

  4. 关于微信手机端IOS系统中input输入框无法输入的问题

    如果网站不需要阻止用户的选择内容的行为就可以使用如下样式: * { -webkit-user-select: text; -user-select: text;}另一种方式: *: not(input ...

  5. 分享一个手机端好用的jquery ajax分页类

    分享一个手机端好用的jquery ajax分页类 jquery-ias.min.js 1,引入jquery-ias.min.js 2,调用ajax分页 <script type="te ...

  6. 判断网页打开浏览器类型,PC 手机端,微信浏览器,,,

    //判断网页打开浏览器类型,PC 手机端,微信浏览器,,, <script type="text/javascript"> var browser = { versio ...

  7. 微信小程序价值思考:手机端的CS-BS迁移

    从很多特点来看,小程序都非常类似于网页:主要的业务逻辑在服务端.客户端无需安装应用程序.小程序的开发采用的HTML+JS+CSS技术等等.张小龙自己对小程序的定位也大概如此:无意做小程序分发平台,只是 ...

  8. js replace 全局替换 以表单的方式提交参数 判断是否为ie浏览器 将jquery.qqFace.js表情转换成微信的字符码 手机端省市区联动 新字体引用本地运行可以获得,放到服务器上报404 C#提取html中的汉字 MVC几种找不到资源的解决方式 使用Windows服务定时去执行一个方法的三种方式

    js replace 全局替换   js 的replace 默认替换只替换第一个匹配的字符,如果字符串有超过两个以上的对应字符就无法进行替换,这时候就要进行一点操作,进行全部替换. <scrip ...

  9. 监听微信端,手机端,ios端的浏览器返回事件,pc端关闭事件

    直接上代码了,可以监听微信端,手机端,iOS端的浏览器返回事件,关闭事件不支持 当进入该页面,我们就给这个history压入一个本地的连接.当点击返回.后退及上一页的操作时,就进行监听,在监听代码中实 ...

随机推荐

  1. 体感在js中的调用

    体感技术,在于人们可以很直接地使用肢体动作,与周边的装置或环境互动,而无需使用任何复杂的控制设备,便可让人们身临其境地与内容做互动. 体感分为三大类: 惯性感测:主要是以惯性传感器为主,例如用重力传感 ...

  2. javascript数组在指定位置添加和删除元素

    在JavaScript中,Array对象提供了一个强大的splice()方法,利用这个方法可以达到在数组的指定位置添加和删除元素的目的. 指定位置删除元素 要在指定位置删除元素,可以使用splice( ...

  3. Linux系统目录结构知识

    1.Linux目录结构: 逻辑上所有的目录只有一个顶点 /(根),所有目录的起点.根下面是一个类似倒挂的树的层次结构. 目录的结构和分区设备是没有关系的,也就是不同的目录可以跨越不同的磁盘设备或分区. ...

  4. Spring Cloud(一):入门篇

    Spring Cloud 简介 Spring Cloud 是一个基于 Spring Boot 实现的微服务架构开发工具,可以快速构建分布式系统中的某些常用模式,如配置管理.服务治理.断路器.智能路由. ...

  5. 2018简约商务工作汇报工作总结公司培训团队介绍PPT模

    这几款ppt模板都是简约大气类型的,32页足够丰富,有完整结构框架,可以修改文字图片直接套用模板,是通用的商务ppt模板. 模版来源:http://ppt.dede58.com/gongzuohuib ...

  6. MySQl看这一篇就够了

    MySQL分享 一.数据库结构 语句 DDL(Data Definition Languages):数据定义语句,常用的语句关键字主要包括 create.drop.alter等操作表结构 DML(Da ...

  7. Taro自定义Modal对话框组件|taro仿微信、android弹窗

    基于Taro多端实践TaroPop:自定义模态框|dialog对话框|msg消息框|Toast提示 taro自定义弹出框支持编译到多端H5/小程序/ReactNative,还可以自定义弹窗类型/弹窗样 ...

  8. SAP MM 无料号采购申请单中'评估价格'之填写

    SAP MM 无料号采购申请单中'评估价格'之填写 1),SAP系统中,采购申请里的'评估价格'来源有二, a)如果是有物料号的采购,则该价格来自于物料主数据里里的成本价(移动平均价或者标准价),自动 ...

  9. 2019 DevOps 必备面试题——代码版本控制篇

    原文地址:https://medium.com/edureka/devops-interview-questions-e91a4e6ecbf3 原文作者:Saurabh Kulshrestha 翻译君 ...

  10. git upstream

    git remote add upstream https://github.com/SchedMD/slurm git fetch upstream git rebase upstream/mast ...