实现携程X分钟前有人预定功能
实现携程X分钟前有人预定功能
原理:利用cookie与计时器两部分;
首先,进入页面,x会被随机数赋值,赋值后x会一分钟加1,直到加到60,再从1开始累加。
页面是否相同是根据页面的url后的id值判断;
<span id='myspan'></span> x分钟前有人预定该景点
<script>
$(document).ready(function() {
if (window.location.href.includes('?')) {
if (window.location.href.split('?')[1].split('=')[0] === 'id') {
var ids = window.location.href.split('?')[1].split('=')[1];
var date = new Date();
date.setTime(date.getTime() + ( 600*1000));
//console.log(decodeURI(ids));
//console.log($.cookie('cookie_urlId'));
urlId = decodeURI(ids); //url的id值
if ($.cookie('cookie_urlId') === urlId) {
console.log(true);
//随机数代码
if ($.cookie('redomnum' + urlId) === undefined) {
//console.log($.cookie('redomnum'));
var num = parseInt(60*Math.random());
if (num === 0) {
num = 1;
}
$('#myspan').text(num);
$.cookie('redomnum' + urlId, num, { express: date });
} else {
$('#myspan').text($.cookie('redomnum' + urlId));
};
} else {
$.cookie('cookie_urlId', urlId, { express: date });
//随机数代码
if ($.cookie('redomnum' + urlId) === undefined) {
//console.log($.cookie('redomnum'));
var num = parseInt(60*Math.random());
if (num === 0) {
num = 1;
}
$('#myspan').text(num);
$.cookie('redomnum' + urlId, num, { express: date });
} else {
$('#myspan').text($.cookie('redomnum' + urlId));
}
}
sendMessage();
function sendMessage(){
window.setInterval(SetReminTime,1000 * 60);
}
function SetReminTime(){
var num = $.cookie('redomnum' + urlId);
if(num === '60'){
num = 0;
}
$.cookie('redomnum' + urlId, ++num, { express: date });
$('#myspan').text($.cookie('redomnum' + urlId));
}
}
}
});
</script>
实现携程X分钟前有人预定功能的更多相关文章
- 携程酒店DevOps测试实践
作者简介 王幸福,携程酒店研发部高级测试经理,负责无线自动化测试相关工作.在测试框架和平台研发.移动测试.DevOps等领域有着丰富的经验. 如今很多大型互联网公司.创新型企业都在积极地进行DevOp ...
- 景点API支持查询携程旅游门票景点详情
门票景点详情,景点api支持查询携程旅游门票景点详情. 接口名称:景点api 接口平台:开放api 接口地址:http://api2.juheapi.com/xiecheng/senicspot/ti ...
- OpenStack虚拟云桌面在携程呼叫中心的应用
编者:本文为刘科在第六期[携程技术微分享]中的分享内容.在携程技术中心(微信号ctriptech)微信后台回复[云桌面],可加入微信交流群,和关注云桌面的小伙伴一起玩耍~ 刘科,携程系统研发云平台桌面 ...
- 解密国内BAT等大厂前端技术体系-携程篇(长文建议收藏)
1 引言 为了了解当前前端的发展趋势,让我们从国内各大互联网大厂开始,了解他们的最新动态和未来规划.这是解密大厂前端技术体系的第四篇,前三篇已经讲述了阿里.腾讯.百度在前端技术这几年的技术发展. 这一 ...
- 携程Apollo统一配置中心的搭建和使用
原文链接:https://blog.csdn.net/luhong327/article/details/81453001 一.Apollo配置中心介绍 1.What is Apollo 1.1 Ap ...
- 携程的 Dubbo 之路,值得学习!
注:本篇文章整理自董艺荃在 Dubbo 社区开发者日上海站的演讲. 1.缘起 携程当初为什么要引入 Dubbo 呢?实际上从 2013 年底起,携程内主要使用的就是基于 HTTP 协议的 SOA 微服 ...
- 携程的 Dubbo 之路
本篇文章整理自董艺荃在 Dubbo 社区开发者日上海站的演讲. 缘起 携程当初为什么要引入 Dubbo 呢?实际上从 2013 年底起,携程内主要使用的就是基于 HTTP 协议的 SOA 微服务框架. ...
- 携程二面:讲讲 MySQL 中的 WAL 策略和 CheckPoint 技术
前段时间我在准备暑期实习嘛,这是当时面携程的时候二面的一道问题,我一脸懵逼,赶紧道歉,不好意思不知道没了解过,面试官又解释说 redo log,我寻思着 redo log 我知道啊,WAL 是啥?给面 ...
- 携程App的网络性能优化实践
首先介绍一下携程App的网络服务架构.由于携程业务众多,开发资源导致无法全部使用Native来实现业务逻辑,因此有相当一部分频道基于Hybrid实现.网络通讯属于基础&业务框架层中基础设施的一 ...
随机推荐
- QQ空间HD(5)-添加左侧菜单栏内容
DJIconView.m #import "DJIconView.h" @implementation DJIconView - (instancetype)initWithFra ...
- R语言学习笔记-机器学习1-3章
在折腾完爬虫还有一些感兴趣的内容后,我最近在看用R语言进行简单机器学习的知识,主要参考了<机器学习-实用案例解析>这本书. 这本书是目前市面少有的,纯粹以R语言为基础讲解的机器学习知识,书 ...
- Hadoop概括——学习笔记<一>
之前有幸在MOOC学院抽中小象学院hadoop体验课. 这是小象学院hadoop2.X概述第一章的笔记 第一章主要讲的是hadoop基础知识.老师讲的还是比较全面简单的,起码作为一个非专业码农以及数据 ...
- 【荐】PDO防 SQL注入攻击 原理分析 以及 使用PDO的注意事项
我们都知道,只要合理正确使用PDO,可以基本上防止SQL注入的产生,本文主要回答以下几个问题: 为什么要使用PDO而不是mysql_connect? 为何PDO能防注入? 使用PDO防注入的时候应该特 ...
- 【分享】SQL中的注入漏洞
例:假设一个账户密码的输入在数据库中是这样进行判断的. ' ) AS PWDCORRECT FROM T_USER WHERE FUSER= 'GUEST' 如果输入: ') AS PWDCORREC ...
- 难道这就是JavaScript中的"闭包"
其实对于JavaScript中的"闭包"还没真正理解,这次在实际Coding中似乎遇到了"闭包"的问题,仅此摘录,以待深究. 表现为jQuery的post方法回 ...
- css3美化复选框checkbox
两种美化效果如下图: 代码(html) <div id="main"> <h2 class="top_title">使用CSS3美化复 ...
- centOS 虚拟机设置固定IP:图形化设置
右键单击图形化标志,Edit Connection 设置一下就可以了.
- IIS跳转html页面自动识别是PC端还是手机端
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 编辑 Ext 表格(一)——— 动态添加删除行列
一.动态增删行 在 ext 表格中,动态添加行主要和表格绑定的 store 有关, 通过对 store 数据集进行添加或删除,就能实现表格行的动态添加删除. (1) 动态添加表格的行 gridS ...