getTime()方法在苹果系统的bug

最新推荐文章于 2023-05-17 23:19:52 发布
最新推荐文章于 2023-05-17 23:19:52 发布
阅读量2k 收藏 1
点赞数
分类专栏： 【JavaScript】 Rattenking 的前端笔记 文章标签： bug 苹果 实例 getTime
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_38082783/article/details/70225600
版权

前几天我在测试苹果系统的一个秒杀页面时发现，“yyyy-MM-dd HH:mm:ss”这种格式的时间在苹果系统中直接用getTime()方法会返回NaN。

 

我们先来看看在安卓系统中的倒计时写法，实例1：时间格式：2016-12-30 23:59:59

 

 

<html lang="zh-CN">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
	<title>倒计时</title>
	<style type="text/css">
		body{margin: 0;background: #eee;}
		.p{
			width: 98%;
			text-align: center;
			height:32px;
			line-height:32px;
			margin: 10px 1%;
			font-size: 0;
		}
		.span,.mh{
			display:inline-block;
			height:32px;
			line-height:32px;
			font-size:16px;
			background:#000;
			color:#fff;
			text-align: center;
		}
		.span{
			width:25%;
			border-radius: 16px;
		}
		.mh{
			width:10%;
			background: #fff;
			border-radius: 16px;
			color: #000;
		}
	</style>
</head>
<body>
<p class="p">
	<span class="span" id="hour">00</span><span class="mh">:</span>
	<span class="span" id="minute">00</span><span class="mh">:</span>
	<span class="span" id="second">00</span>
</p>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
	var countdown=function(a){
		function countDown(){
			intDiff = intDiff - 1000;
            if(intDiff<=0){
				$(a.hour).html("00");
				$(a.minute).html("00");
				$(a.section).html("00");
			}else{
				var day = Math.floor(intDiff / (1000 * 60 * 60 * 24));
				var hour2 = Math.floor(intDiff / (1000 * 60 * 60));
				var hour = Math.floor(intDiff / (1000 * 60 * 60)) - (day * 24);
				var minute = Math.floor(intDiff / (1000 * 60)) - (day * 24 * 60) - (hour * 60);
				var second = Math.floor(intDiff / 1000) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
				if(hour2<=9){hour2="0"+hour2;};
				if(minute<=9){minute="0"+minute;};
				if(second<=9){second="0"+second;};
				$(a.hour).html(hour2);
				$(a.minute).html(minute);
				$(a.section).html(second);
			}
			setTimeout(countDown,1000);
		}
		countDown();
	}
	var endTime = new Date('2016-12-30 23:59:59').getTime();
	var startTime = new Date().getTime();
	var intDiff = endTime - startTime;
	countdown({hour:"#hour",minute:"#minute",section:"#second"});
</script>
</body>
</html>


上述时间处理方法，快捷简单，但是在苹果系统中会返回NaN，那么我们应该怎么处理呢？
第一种方法：时间格式的处理，时间格式：Fri Dec 30 2016 23:59:59 GMT+0800

 

 

 

 

<html lang="zh-CN">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
	<title>倒计时</title>
	<style type="text/css">
		body{margin: 0;background: #eee;}
		.p{
			width: 98%;
			text-align: center;
			height:32px;
			line-height:32px;
			margin: 10px 1%;
			font-size: 0;
		}
		.span,.mh{
			display:inline-block;
			height:32px;
			line-height:32px;
			font-size:16px;
			background:#000;
			color:#fff;
			text-align: center;
		}
		.span{
			width:25%;
			border-radius: 16px;
		}
		.mh{
			width:10%;
			background: #fff;
			border-radius: 16px;
			color: #000;
		}
	</style>
</head>
<body>
<p class="p">
	<span class="span" id="hour">00</span><span class="mh">:</span>
	<span class="span" id="minute">00</span><span class="mh">:</span>
	<span class="span" id="second">00</span>
</p>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
	var countdown=function(a){
		function countDown(){
			intDiff = intDiff - 1000;
            if(intDiff<=0){
				$(a.hour).html("00");
				$(a.minute).html("00");
				$(a.section).html("00");
			}else{
				var day = Math.floor(intDiff / (1000 * 60 * 60 * 24));
				var hour2 = Math.floor(intDiff / (1000 * 60 * 60));
				var hour = Math.floor(intDiff / (1000 * 60 * 60)) - (day * 24);
				var minute = Math.floor(intDiff / (1000 * 60)) - (day * 24 * 60) - (hour * 60);
				var second = Math.floor(intDiff / 1000) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
				if(hour2<=9){hour2="0"+hour2;};
				if(minute<=9){minute="0"+minute;};
				if(second<=9){second="0"+second;};
				$(a.hour).html(hour2);
				$(a.minute).html(minute);
				$(a.section).html(second);
			}
			setTimeout(countDown,1000);
		}
		countDown();
	}
	var endTime = new Date('Fri Dec 30 2016 23:59:59 GMT+0800').getTime();
	var startTime = new Date().getTime();
	var intDiff = endTime - startTime;
	countdown({hour:"#hour",minute:"#minute",section:"#second"});
</script>
</body>
</html>


第二种方法：将时间自己处理，1、时间格式：2016-12-30 23:59:59；2、处理方法：disposeTime（）

 

 

 

<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<title>倒计时</title>
<style type="text/css">
body{margin: 0;background: #eee;}
.p{
width: 98%;
text-align: center;
height:32px;
line-height:32px;
margin: 10px 1%;
font-size: 0;
}
.span,.mh{
display:inline-block;
height:32px;
line-height:32px;
font-size:16px;
background:#000;
color:#fff;
text-align: center;
}
.span{
width:25%;
border-radius: 16px;
}
.mh{
width:10%;
background: #fff;
border-radius: 16px;
color: #000;
}
</style>
</head>
<body>
<p class="p">
<span class="span" id="hour">00</span><span class="mh">:</span>
<span class="span" id="minute">00</span><span class="mh">:</span>
<span class="span" id="second">00</span>
</p>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
var countdown=function(a){
function countDown(){
intDiff = intDiff - 1000;
            if(intDiff<=0){
$(a.hour).html("00");
$(a.minute).html("00");
$(a.section).html("00");
}else{
var day = Math.floor(intDiff / (1000 * 60 * 60 * 24));
var hour2 = Math.floor(intDiff / (1000 * 60 * 60));
var hour = Math.floor(intDiff / (1000 * 60 * 60)) - (day * 24);
var minute = Math.floor(intDiff / (1000 * 60)) - (day * 24 * 60) - (hour * 60);
var second = Math.floor(intDiff / 1000) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
if(hour2<=9){hour2="0"+hour2;};
if(minute<=9){minute="0"+minute;};
if(second<=9){second="0"+second;};
$(a.hour).html(hour2);
$(a.minute).html(minute);
$(a.section).html(second);
}
setTimeout(countDown,1000);
}
countDown();
}
        var disposeTime = function(a){
              a = a || new Date().getTime() + 24*60*60*1000;
              timeArr0 = a.split(' ');
              timeArr1 = timeArr0[1].split(':');
              return new Date(timeArr0[0]).getTime() + timeArr1[0]*3600000 + timeArr1[1]*60000 + timeArr1[2]*1000 - 8*3600*1000;
        }
var endTime = disposeTime('2016-12-30 23:59:59');
var startTime = new Date().getTime();
var intDiff = endTime - startTime;
countdown({hour:"#hour",minute:"#minute",section:"#second"});
</script>
</body>
</html>

其他

[我的博客，欢迎交流！](http://rattenking.gitee.io/stone/index.html)

[我的CSDN博客，欢迎交流！](https://blog.csdn.net/m0_38082783)

[微信小程序专栏](https://blog.csdn.net/column/details/18335.html)

[前端笔记专栏](https://blog.csdn.net/column/details/18321.html)

[微信小程序实现部分高德地图功能的DEMO下载](http://download.csdn.net/download/m0_38082783/10244082)

[微信小程序实现MUI的部分效果的DEMO下载](http://download.csdn.net/download/m0_38082783/10196944)

[微信小程序实现MUI的GIT项目地址](https://github.com/Rattenking/WXTUI-DEMO)

[微信小程序实例列表](http://blog.csdn.net/m0_38082783/article/details/78853722)

[前端笔记列表](http://blog.csdn.net/m0_38082783/article/details/79208205)

[游戏列表](http://blog.csdn.net/m0_38082783/article/details/79035621)

Rattenking
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
newData().getTime()中在苹果上报错
郭宝的博客
11-16 464
//在安卓上这个写可以获取到的 var date = '2017-06-12'; var time = new Date(date).getTime()/1000; //但在苹果手机上是不支持的，必须这样写： var date = '2017-06-12'; var time = new Date(date.replace(/-/g,'/')).getTime()/1000; ...
Android获取系统时间的多种方法
01-20
在Android开发中，获取系统时间是一项常见的任务，用于记录或者展示日期和时间信息。本文将详细介绍四种不同的方式来获取Android系统的当前时间，并讨论日期格式化的相关知识。 **方法一：使用System....
ios 中 new Date().getTime() 方法兼容性问题
qq_34344148的博客
05-17 204
【代码】ios 中 new Date().getTime() 方法兼容性问题。
js时间函数getTime() 在苹果手机上返回NaN的问题
weixin_33712881的博客
11-18 816
2019独角兽企业重金招聘Python工程师标准>>> ...
ios系统getFullYear兼容性问题
yyanglirong的博客
11-18 755
接上篇博客，判断了日期是否为本月日期中用到了getFullYear（）方法。测试人员发现苹果手机显示不对，然后就开始一系列的变量打印，最后发现苹果手机对该方法不兼容 有兼容性问题,需要把中横线换成斜杠。 new Date(“2017-02-16 20:41:10”.replace(/-/g,’/’)).getFullYear() ...
js时间操作getTime(),ios移动端真机上返回显示NAN
weixin_34292924的博客
04-09 359
ios移动端，js时间操作getTime(),getFullYear()等返回显示NaN的解决办法及原因 在做移动端时间转化为时间戳时，遇到了一个问题，安卓手机上访问时，能拿到时间戳，从而正确转换时间，而在iOS上缺不能正常显示，显示的时间为：NaN-NaN1-NaN 在网上找问题出现原因，看到以下内容： 在IOS5以上版本（不包含IOS5）中的Safari浏览器能正确解释出Java...
JavaScript中的getTime()方法使用详解
01-21
javascript Date.getTime()方法按照通用时间对应的时间为指定日期返回数值。由getTime方法返回的值是毫秒自1970年1月1日00:00:00的数。 您可以使用此方法来帮助指定日期和时间到另一个Date对象。 语法 Date.getTime...
深入理解javascript的getTime()方法
12-11
在与其他支持UTC时间戳的系统（如服务器APIs或数据库）进行交互时，`getTime()`返回的数值非常方便，因为它们遵循同一标准。 总结来说，JavaScript的`getTime()`方法是处理日期和时间的核心工具，无论是在分析代码...
ios中 safari浏览器，js时间操作getTime(),getFullYear()等返回显示NaN的解决办法
gooodi的博客
05-22 3127
查了下原因大概是:在IOS5以上版本（不包含IOS5）中的Safari浏览器能正确解释出Javascript中的 new Date('2013-10-21') 的日期对象。 但是在IOS5版本里面的Safari解释new Date('2019-5-21') 就不正确，在IOS5的Safari中返回的永远是"Invalid Date"。 后来我在网上查找了资料，原来是低版本的Safari解释new ...
JavaScript 中 new Date(time).getTime() 获取时间戳方法在 iOS 中的兼容性问题
忧郁的蛋的专栏
04-14 1476
在 iOS 系统的 H5 页面中获取时间戳方法存在返回 NaN 或结果不准确的情况。
时间戳中newData().getTime()中在苹果上的问题
weixin_34062469的博客
06-26 724
1、今天遇到这么个问题，将时间转化为毫秒在苹果手机上出现NaN 情况 //在安卓上这个写可以获取到的 var date = '2017-06-12'; var time = new Date(date).getTime()/1000; //但在苹果手机上是不支持的，必须这样写： var time = new Date(date.replace(/-/g,'/')).getTime()...
new Date(date).getTime()在苹果手机不兼容
m0_37395016的博客
05-07 8773
今天遇到一个大坑。 new Date(date).getTime()，用这个方法来获取时间戳， 在手机上就是NaN，在Google浏览器就是没有问题！ 由于是真机调试，又费劲时间又久。 就很纳闷，这么简单的方法到底错在哪了。 加班寻找解决办法，才在一个小角落发现， new Date(date).getTime()在苹果手机上是不兼容的。 虽然是一个小小的兼容性问题， 可是没有...
new Date(date).getTime() 苹果手机不兼容
清晨的一缕阳光
08-18 605
new Date(date).getTime()，在手机上就是NaN，在Google浏览器没有问题 后发现是new Date(date).getTime()在苹果手机上是不兼容的。 解决办法： new Date(data.replace(/-/g,'/')).getTime() data是字符串，格式类似于：‘2018-09-09 23:23:23’ ...
new Date(date)与new Date(date).getTime()在苹果手机中返回NaN
weixin_43968963的博客
08-15 814
new Date(date).getTime()方法来获取时间戳，在苹果手机上不兼容，返回NaN。new Date(date)方法进行字符串日期转换成时间格式，在苹果手机上不兼容，返回NaN。解决办法：(data是字符串，格式类似于：‘2022-05-31 09:17:40’)原因：因为ios下只能解析反斜杠 / 而无法解析 - 导致的。...
getTime（）在苹果手机上返回NaN的问题
weixin_40918145的博客
02-26 373
原文地址：https://www.jianshu.com/p/648e71970734 今天在项目中的一个js文件中，使用了getTime()的方法来获取毫秒数。但是在手机中运行项目的时候发现，苹果手机获取毫秒数异常。返回NaN。 var newStartDate = new Date('2017-08-30'); var newStartTime = newStartDate.getTime(); 这样写在安卓手机上面是正常获取到，但是苹果手机是NaN。所以进行了一下修改 var new
苹果ios用js的Date（）出现NaN问题解决办法
热门推荐
Cooky的博客
04-26 1万+
ios使用如下方法获得NaN，安卓手机则是正常计算，解决方法是换个这个时间的格式new Date("2017-04-28 23:59:59").getTime()换成如下方式就正常了，就是‘-’换成‘/’new Date("2017/04/28 23:59:59").getTime()
js 方法getTime()
最新发布
07-12
getTime() 是 JavaScript Date 对象的方法，它返回自1970年1月1日 00:00:00 UTC（协调世界时）到当前日期和时间的毫秒数。 例如，可以使用以下代码获取当前时间的毫秒数： ```javascript const currentDate = new ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Rattenking

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值