首页 > 解决方案 > 时间仅在 iPhone 上显示为 Nan

问题描述

我不知道为什么我time left在观看时显示为 NaN

苹果手机

在此处输入图像描述

Chrome 中的移动模拟器显示工作正常

在此处输入图像描述

我什至尝试了我在 jsfiddle 中使用的相同代码的实验

https://jsfiddle.net/bheng/7w8cftyL/

它也在那里工作!

还有其他人也面临这个问题吗?


代码

<div class="timeLeft"></div>




function timeDiffCalc(dateFuture, dateNow) {
    let diffInMilliSeconds = Math.abs(dateFuture - dateNow) / 1000;

    const days = Math.floor(diffInMilliSeconds / 86400);
    diffInMilliSeconds -= days * 86400;
    console.log('calculated days', days);

    const hours = Math.floor(diffInMilliSeconds / 3600) % 24;
    diffInMilliSeconds -= hours * 3600;
    console.log('calculated hours', hours);

    const minutes = Math.floor(diffInMilliSeconds / 60) % 60;
    diffInMilliSeconds -= minutes * 60;
    console.log('minutes', minutes);

    let difference = '';
    if (days > 0) {
        difference += (days === 1) ? `${days} day, ` : `${days} days, `;
    }

    difference += (hours === 0 || hours === 1) ? `${hours} hour, ` : `${hours} hours, `;

    difference += (minutes === 0 || hours === 1) ? `${minutes} minutes` : `${minutes} minutes`; 

    return difference;
}


var timeLeft = timeDiffCalc(new Date('2021-02-17 20:44:50'), new Date()); 
$('.timeLeft').text(timeLeft + " more..."); 

标签: javascriptjqueryiphonedate

解决方案


T时间之前用作时间指示器,如下所示

var timeLeft = timeDiffCalc(new Date('2021-02-17T20:44:50'), new Date());

您可以在 MDN 中查看更多日期创建选项:https ://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#several_ways_to_create_a_date_object

更新:

根据作者的评论,日期是动态给出的。要插入提到的T内容,您可以使用string.replace如下:

var dateStr = '2021-02-17 20:44:50';
dateStr = dateStr.replace(' ', 'T');
var timeLeft = timeDiffCalc(new Date(dateStr), new Date()); 

推荐阅读