当前位置: 首页 > news >正文

实现携程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>

转载于:https://www.cnblogs.com/webzwf/p/5784773.html

相关文章:

  • 怎么让块级元素水平和垂直都居中
  • 百度实习面经-JAVA研发方向
  • P1143 飘飘乎居士的约会
  • 让win7变成无线路由(需要用管理员权限打开)最后完善.rar
  • mysql 在大型应用中的架构演变
  • android 在布局中动态添加控件
  • JdbcTemplate+PageImpl实现多表分页查询
  • python os.path
  • 全国开设艺术类专业的211、985工程院校汇总
  • 优先队列的用法
  • 如何保持响应式设计新鲜感
  • 设计模式之Iterator模式
  • hbase rowkey设计的注意事项
  • SQL 必知必会
  • Javascript学习4 - 对象和数组
  • JavaScript-如何实现克隆(clone)函数
  • 2018一半小结一波
  • AngularJS指令开发(1)——参数详解
  • Django 博客开发教程 16 - 统计文章阅读量
  • ES学习笔记(12)--Symbol
  • happypack两次报错的问题
  • iOS | NSProxy
  • iOS帅气加载动画、通知视图、红包助手、引导页、导航栏、朋友圈、小游戏等效果源码...
  • Python进阶细节
  • Python十分钟制作属于你自己的个性logo
  • Rancher如何对接Ceph-RBD块存储
  • 多线程事务回滚
  • 构建二叉树进行数值数组的去重及优化
  • 前端攻城师
  • 前端性能优化——回流与重绘
  • 使用docker-compose进行多节点部署
  • 使用权重正则化较少模型过拟合
  • 双管齐下,VMware的容器新战略
  • 写给高年级小学生看的《Bash 指南》
  • 移动互联网+智能运营体系搭建=你家有金矿啊!
  • 原生js练习题---第五课
  • 看到一个关于网页设计的文章分享过来!大家看看!
  • 曜石科技宣布获得千万级天使轮投资,全方面布局电竞产业链 ...
  • ​香农与信息论三大定律
  • # .NET Framework中使用命名管道进行进程间通信
  • # 深度解析 Socket 与 WebSocket:原理、区别与应用
  • ###项目技术发展史
  • #git 撤消对文件的更改
  • #微信小程序:微信小程序常见的配置传值
  • #我与虚拟机的故事#连载20:周志明虚拟机第 3 版:到底值不值得买?
  • #中国IT界的第一本漂流日记 传递IT正能量# 【分享得“IT漂友”勋章】
  • $NOIp2018$劝退记
  • (1)(1.9) MSP (version 4.2)
  • (30)数组元素和与数字和的绝对差
  • (52)只出现一次的数字III
  • (AngularJS)Angular 控制器之间通信初探
  • (五) 一起学 Unix 环境高级编程 (APUE) 之 进程环境
  • (一)SpringBoot3---尚硅谷总结
  • (转)利用ant在Mac 下自动化打包签名Android程序
  • **CI中自动类加载的用法总结