实现携程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分钟前有人预定功能的更多相关文章

  1. 携程酒店DevOps测试实践

    作者简介 王幸福,携程酒店研发部高级测试经理,负责无线自动化测试相关工作.在测试框架和平台研发.移动测试.DevOps等领域有着丰富的经验. 如今很多大型互联网公司.创新型企业都在积极地进行DevOp ...

  2. 景点API支持查询携程旅游门票景点详情

    门票景点详情,景点api支持查询携程旅游门票景点详情. 接口名称:景点api 接口平台:开放api 接口地址:http://api2.juheapi.com/xiecheng/senicspot/ti ...

  3. OpenStack虚拟云桌面在携程呼叫中心的应用

    编者:本文为刘科在第六期[携程技术微分享]中的分享内容.在携程技术中心(微信号ctriptech)微信后台回复[云桌面],可加入微信交流群,和关注云桌面的小伙伴一起玩耍~ 刘科,携程系统研发云平台桌面 ...

  4. 解密国内BAT等大厂前端技术体系-携程篇(长文建议收藏)

    1 引言 为了了解当前前端的发展趋势,让我们从国内各大互联网大厂开始,了解他们的最新动态和未来规划.这是解密大厂前端技术体系的第四篇,前三篇已经讲述了阿里.腾讯.百度在前端技术这几年的技术发展. 这一 ...

  5. 携程Apollo统一配置中心的搭建和使用

    原文链接:https://blog.csdn.net/luhong327/article/details/81453001 一.Apollo配置中心介绍 1.What is Apollo 1.1 Ap ...

  6. 携程的 Dubbo 之路,值得学习!

    注:本篇文章整理自董艺荃在 Dubbo 社区开发者日上海站的演讲. 1.缘起 携程当初为什么要引入 Dubbo 呢?实际上从 2013 年底起,携程内主要使用的就是基于 HTTP 协议的 SOA 微服 ...

  7. 携程的 Dubbo 之路

    本篇文章整理自董艺荃在 Dubbo 社区开发者日上海站的演讲. 缘起 携程当初为什么要引入 Dubbo 呢?实际上从 2013 年底起,携程内主要使用的就是基于 HTTP 协议的 SOA 微服务框架. ...

  8. 携程二面:讲讲 MySQL 中的 WAL 策略和 CheckPoint 技术

    前段时间我在准备暑期实习嘛,这是当时面携程的时候二面的一道问题,我一脸懵逼,赶紧道歉,不好意思不知道没了解过,面试官又解释说 redo log,我寻思着 redo log 我知道啊,WAL 是啥?给面 ...

  9. 携程App的网络性能优化实践

    首先介绍一下携程App的网络服务架构.由于携程业务众多,开发资源导致无法全部使用Native来实现业务逻辑,因此有相当一部分频道基于Hybrid实现.网络通讯属于基础&业务框架层中基础设施的一 ...

随机推荐

  1. [NHibernate]一对多关系(关联查询)

    目录 写在前面 文档与系列文章 一对多查询 总结 写在前面 上篇文章介绍了nhibernate的一对多关系如何配置,以及级联删除,级联添加数据的内容.这篇文章我们将学习nhibernate中的一对多关 ...

  2. [译]使用branch

    这篇文章将介绍Git分支. 首先, 看看如果创建分支, 这就像是request一个新的项目历史. 接着, 来看看git checkout是如果能被用来选择一个分支的. 最后, 学习用git merge ...

  3. 反射的一些用法(WP8.1下)

    我初步的理解:反射就是动态调用(dll)类. 比如某个dll有一个类,通过反射就可以知道它里面属性.方法,就可以实现调用. 确实,dll可以直接引用,但是如果遇到这种情况: 添加.删除功能同属一个Dl ...

  4. Swift3.0P1 语法指南——方法

    原档:https://developer.apple.com/library/prerelease/ios/documentation/Swift/Conceptual/Swift_Programmi ...

  5. [译]Android调整图像大小的一些方法

    翻译自 某大神在Stack Overflow里的自问自答 (一般我们将Bitmap翻译为位图,但为了更好理解,在本文中我将它翻译成图像): 我们在开发的时候,经常需要从服务器中加载图像到客户端中,但有 ...

  6. 项目vue2.0仿外卖APP(一)

    最近用vue.js做一个仿饿了么外卖APP的项目,现在也把流程啊什么的暂时先整理一下在这个博客上面. 当然,这个过程会有点长,不过确实能学到很多东西. 话不多说,马上开始吧. 1.项目介绍 选用当前最 ...

  7. [Keygen]IntelliJ IDEA 14.1.7

    IntelliJ IDEA 14.1.7 Keygen package com.candy.keygen.intelliJIdea; import java.math.BigInteger; impo ...

  8. Proj.4坐标系统创建参数

    Proj.4坐标系统创建参数 本文由乌合之众lym瞎编,欢迎转载blog.cnblogs.net/oloroso 本文原文地址(https://github.com/OSGeo/proj.4/wiki ...

  9. SQL,Linq,Lambda之间的转换练习

    1.查询Student表中的所有记录的Sname.Ssex和Class列. SQL:select sname,ssex,class from Students linq:from s in Stude ...

  10. libcpmt.lib 与 msvcprt.lib

    https://msdn.microsoft.com/en-us/library/2kzt1wy3(VS.80).aspx