PHP+Ajax微信手机端九宫格抽奖实例
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微信手机端九宫格抽奖实例的更多相关文章
- js仿手机端九宫格登录功能
js仿手机端九宫格登录功能 最近闲来无事把以前无聊时开发的小东西拿出来和大家分享下,写的不好的请指出,我会及时修改.谢谢. 功能及方法逻辑都注释在代码中.所以麻烦大家直接看代码. 效果如下: 话不多说 ...
- php+lottery.js制作九宫格抽奖实例
php+lottery.js制作九宫格抽奖实例,本抽奖功能效果表现好,定制方便简单,新手学习跟直接拿来用都非常不错,兼容IE.火狐.谷歌等浏览器. 引入抽奖插件lottery.js <scrip ...
- 【实战问题】【4】Vue写的页面在微信手机端和微信web开发者工具中都能正常显示,但是在微信pc端上显示空白
原因:pc端微信浏览器不支持es6,而代码中使用了 let . 解决:将 let 改为 var(若使用 es6 语法比较多,可以进行转换,将 es6 语法转为 es5) 参考博客: 1,h5微信页面在 ...
- 关于微信手机端IOS系统中input输入框无法输入的问题
如果网站不需要阻止用户的选择内容的行为就可以使用如下样式: * { -webkit-user-select: text; -user-select: text;}另一种方式: *: not(input ...
- 分享一个手机端好用的jquery ajax分页类
分享一个手机端好用的jquery ajax分页类 jquery-ias.min.js 1,引入jquery-ias.min.js 2,调用ajax分页 <script type="te ...
- 判断网页打开浏览器类型,PC 手机端,微信浏览器,,,
//判断网页打开浏览器类型,PC 手机端,微信浏览器,,, <script type="text/javascript"> var browser = { versio ...
- 微信小程序价值思考:手机端的CS-BS迁移
从很多特点来看,小程序都非常类似于网页:主要的业务逻辑在服务端.客户端无需安装应用程序.小程序的开发采用的HTML+JS+CSS技术等等.张小龙自己对小程序的定位也大概如此:无意做小程序分发平台,只是 ...
- js replace 全局替换 以表单的方式提交参数 判断是否为ie浏览器 将jquery.qqFace.js表情转换成微信的字符码 手机端省市区联动 新字体引用本地运行可以获得,放到服务器上报404 C#提取html中的汉字 MVC几种找不到资源的解决方式 使用Windows服务定时去执行一个方法的三种方式
js replace 全局替换 js 的replace 默认替换只替换第一个匹配的字符,如果字符串有超过两个以上的对应字符就无法进行替换,这时候就要进行一点操作,进行全部替换. <scrip ...
- 监听微信端,手机端,ios端的浏览器返回事件,pc端关闭事件
直接上代码了,可以监听微信端,手机端,iOS端的浏览器返回事件,关闭事件不支持 当进入该页面,我们就给这个history压入一个本地的连接.当点击返回.后退及上一页的操作时,就进行监听,在监听代码中实 ...
随机推荐
- Leetcode题解 - 树部分简单题目代码+思路(105、106、109、112、897、257、872、226、235、129)
树的题目中递归用的比较多(但是递归是真难弄 我
- PHP 开发工程师基础篇 - PHP 数组
数组 (Array) 数组是 PHP 中最重要的数据类型,可以说是掌握数组,基本上 PHP 一大半问题都可以解决. PHP 数组与其他编程语言数组概念不一样.其他编程语言数组是由相同类型的元素(ele ...
- ETCD:etcd网关
原文地址:L4 gateway 什么是etcd网关 etcd网关是一个简单的TCP代理,可将网络数据转发到etcd集群.网关是无状态且透明的: 它既不会检查客户端请求,也不会干扰群集响应. 网关支持多 ...
- ASP.NET页面缓冲
整页缓存<% OutPutCache Duration=5 VaryByParam="none" %>Duration是缓冲时间 参数可以有多个 在varyByPara ...
- Java描述设计模式(05):原型模式
本文源码:GitHub·点这里 || GitEE·点这里 一.原型模式简介 1.基础概念 原型模式属于对象的创建模式.通过给出一个原型对象来指明所有创建的对象的类型,然后用复制这个原型对象的办法创建出 ...
- springaop\ cglib\ AspectJ
元编程 vs 动态代理 vs isa代理 springaop的底层实现有两种,一种是jdk的动态代理,另一种是cglib,springaop没有用到aspectj,只是借鉴了它并添加了aspectj风 ...
- Slickflow.NET 开源工作流引擎快速入门之二: 简单并行分支流程代码编写示例
前言:对于急切想了解引擎功能的开发人员,在下载版本后,就想尝试编写代码,完成一个流程的开发和测试.本文试图从一个最简单的并行分支流程来示例说明,如何快速了解引擎代码的编写. 版本:.NET Core2 ...
- Java生鲜电商平台-电商系统性能指标
Java生鲜电商平台-电商系统性能指标 1.响应时间和吞吐量 根据应用程序的响应时间可以知道程序完成传输数据所用的时间.也可以从HTTP请求级别,或者成为数据库级别来看.对那些缓慢的查询你需要做一些优 ...
- [转]Paste from Excel into C# app, retaining full precision
本文转自:https://stackoverflow.com/questions/8614910/paste-from-excel-into-c-sharp-app-retaining-full-pr ...
- nginx——keepalived
nginx--keepalived 1.keepalived高可用基本概述 什么是高可用 一般是指2台机器启动着完全相同的业务系统,当有一台机器down机了,另外一台服务器就能快速的接管,对于访问的用 ...