JS与UNIX时间戳或时间戳日期有时差

时间:2016-12-29 13:15:53

标签: javascript datetime mobile time unix-timestamp

我有一些内部带有UNIX时间戳的元素,这对客户端没用。所以我将它们转换成

  • 不到一分钟之前="刚才#34;

  • 不到一小时前=" X分钟前"

  • 不到一天前=" X小时前"

  • 其他:"时间戳 - >实际日期"。

首先,我的代码有效,不适用于iPhone5等移动设备。这些器件的结果将是: NaN NaN NaN NaN 。我很想知道如何解决这个问题。

另一件事是,我认为我的javascript看起来很愚蠢。但我无法弄清楚如何循环这些不同的时间条件。这里的建议没有必要,但感激不尽。

注意:在加载页面之前,我无法更改段落的结构。设置我的段落将包含UNIX时间戳。这是我的起始位置。

这里是我的完整html,负载为< p>示例,复制&准备就绪:

<!DOCTYPE html>

<html>

<head>
<script>
    function startTime() {

        var dates = document.getElementsByClassName('date');

        for (var i = 0; i < dates.length; i++) {

            var currentdate = Date.now();

            if (dates[i].innerHTML !== '') {

                var date = new Date(dates[i].innerHTML*1000);

                if (currentdate - 60000 <= date) {dates[i].innerHTML = "just now"}
                else if (currentdate - 120000 <= date) {dates[i].innerHTML = "1 min ago"}
                else if (currentdate - 180000 <= date) {dates[i].innerHTML = "2 mins ago"}
                else if (currentdate - 240000 <= date) {dates[i].innerHTML = "3 mins ago"}
                else if (currentdate - 300000 <= date) {dates[i].innerHTML = "4 mins ago"}
                else if (currentdate - 360000 <= date) {dates[i].innerHTML = "5 mins ago"}
                else if (currentdate - 420000 <= date) {dates[i].innerHTML = "6 mins ago"}
                else if (currentdate - 480000 <= date) {dates[i].innerHTML = "7 mins ago"}
                else if (currentdate - 540000 <= date) {dates[i].innerHTML = "8 mins ago"}
                else if (currentdate - 600000 <= date) {dates[i].innerHTML = "9 mins ago"}
                else if (currentdate - 660000 <= date) {dates[i].innerHTML = "10 mins ago"}
                else if (currentdate - 720000 <= date) {dates[i].innerHTML = "11 mins ago"}
                else if (currentdate - 780000 <= date) {dates[i].innerHTML = "12 mins ago"}
                else if (currentdate - 840000 <= date) {dates[i].innerHTML = "13 mins ago"}
                else if (currentdate - 900000 <= date) {dates[i].innerHTML = "14 mins ago"}
                else if (currentdate - 960000 <= date) {dates[i].innerHTML = "15 mins ago"}
                else if (currentdate - 1020000 <= date) {dates[i].innerHTML = "16 mins ago"}
                else if (currentdate - 1080000 <= date) {dates[i].innerHTML = "17 mins ago"}
                else if (currentdate - 1140000 <= date) {dates[i].innerHTML = "18 mins ago"}
                else if (currentdate - 1200000 <= date) {dates[i].innerHTML = "19 mins ago"}
                else if (currentdate - 1260000 <= date) {dates[i].innerHTML = "20 mins ago"}
                else if (currentdate - 1320000 <= date) {dates[i].innerHTML = "21 mins ago"}
                else if (currentdate - 1380000 <= date) {dates[i].innerHTML = "22 mins ago"}
                else if (currentdate - 1440000 <= date) {dates[i].innerHTML = "23 mins ago"}
                else if (currentdate - 1500000 <= date) {dates[i].innerHTML = "24 mins ago"}
                else if (currentdate - 1560000 <= date) {dates[i].innerHTML = "25 mins ago"}
                else if (currentdate - 1620000 <= date) {dates[i].innerHTML = "26 mins ago"}
                else if (currentdate - 1680000 <= date) {dates[i].innerHTML = "27 mins ago"}
                else if (currentdate - 1740000 <= date) {dates[i].innerHTML = "28 mins ago"}
                else if (currentdate - 1800000 <= date) {dates[i].innerHTML = "29 mins ago"}
                else if (currentdate - 1860000 <= date) {dates[i].innerHTML = "30 mins ago"}
                else if (currentdate - 1920000 <= date) {dates[i].innerHTML = "31 mins ago"}
                else if (currentdate - 1980000 <= date) {dates[i].innerHTML = "32 mins ago"}
                else if (currentdate - 2040000 <= date) {dates[i].innerHTML = "33 mins ago"}
                else if (currentdate - 2100000 <= date) {dates[i].innerHTML = "34 mins ago"}
                else if (currentdate - 2160000 <= date) {dates[i].innerHTML = "35 mins ago"}
                else if (currentdate - 2220000 <= date) {dates[i].innerHTML = "36 mins ago"}
                else if (currentdate - 2280000 <= date) {dates[i].innerHTML = "37 mins ago"}
                else if (currentdate - 2340000 <= date) {dates[i].innerHTML = "38 mins ago"}
                else if (currentdate - 2400000 <= date) {dates[i].innerHTML = "39 mins ago"}
                else if (currentdate - 2460000 <= date) {dates[i].innerHTML = "40 mins ago"}
                else if (currentdate - 2520000 <= date) {dates[i].innerHTML = "41 mins ago"}
                else if (currentdate - 2580000 <= date) {dates[i].innerHTML = "42 mins ago"}
                else if (currentdate - 2640000 <= date) {dates[i].innerHTML = "43 mins ago"}
                else if (currentdate - 2700000 <= date) {dates[i].innerHTML = "44 mins ago"}
                else if (currentdate - 2760000 <= date) {dates[i].innerHTML = "45 mins ago"}
                else if (currentdate - 2820000 <= date) {dates[i].innerHTML = "46 mins ago"}
                else if (currentdate - 2880000 <= date) {dates[i].innerHTML = "47 mins ago"}
                else if (currentdate - 2940000 <= date) {dates[i].innerHTML = "48 mins ago"}
                else if (currentdate - 3000000 <= date) {dates[i].innerHTML = "49 mins ago"}
                else if (currentdate - 3060000 <= date) {dates[i].innerHTML = "50 mins ago"}
                else if (currentdate - 3120000 <= date) {dates[i].innerHTML = "51 mins ago"}
                else if (currentdate - 3180000 <= date) {dates[i].innerHTML = "52 mins ago"}
                else if (currentdate - 3240000 <= date) {dates[i].innerHTML = "53 mins ago"}
                else if (currentdate - 3300000 <= date) {dates[i].innerHTML = "54 mins ago"}
                else if (currentdate - 3360000 <= date) {dates[i].innerHTML = "55 mins ago"}
                else if (currentdate - 3420000 <= date) {dates[i].innerHTML = "56 mins ago"}
                else if (currentdate - 3480000 <= date) {dates[i].innerHTML = "57 mins ago"}
                else if (currentdate - 3540000 <= date) {dates[i].innerHTML = "58 mins ago"}
                else if (currentdate - 3600000 <= date) {dates[i].innerHTML = "59 mins ago"}
                else if (currentdate - 7320000 <= date) {dates[i].innerHTML = "1 hr ago"}
                else if (currentdate - 10980000 <= date) {dates[i].innerHTML = "2 hrs ago"}
                else if (currentdate - 14640000 <= date) {dates[i].innerHTML = "3 hrs ago"}
                else if (currentdate - 18300000 <= date) {dates[i].innerHTML = "4 hrs ago"}
                else if (currentdate - 21960000 <= date) {dates[i].innerHTML = "5 hrs ago"}
                else if (currentdate - 25620000 <= date) {dates[i].innerHTML = "6 hrs ago"}
                else if (currentdate - 29280000 <= date) {dates[i].innerHTML = "7 hrs ago"}
                else if (currentdate - 32940000 <= date) {dates[i].innerHTML = "8 hrs ago"}
                else if (currentdate - 36600000 <= date) {dates[i].innerHTML = "9 hrs ago"}
                else if (currentdate - 40260000 <= date) {dates[i].innerHTML = "10 hrs ago"}
                else if (currentdate - 43920000 <= date) {dates[i].innerHTML = "11 hrs ago"}
                else if (currentdate - 47580000 <= date) {dates[i].innerHTML = "12 hrs ago"}
                else if (currentdate - 51240000 <= date) {dates[i].innerHTML = "13 hrs ago"}
                else if (currentdate - 54900000 <= date) {dates[i].innerHTML = "14 hrs ago"}
                else if (currentdate - 58560000 <= date) {dates[i].innerHTML = "15 hrs ago"}
                else if (currentdate - 62220000 <= date) {dates[i].innerHTML = "16 hrs ago"}
                else if (currentdate - 65880000 <= date) {dates[i].innerHTML = "17 hrs ago"}
                else if (currentdate - 69540000 <= date) {dates[i].innerHTML = "18 hrs ago"}
                else if (currentdate - 73200000 <= date) {dates[i].innerHTML = "19 hrs ago"}
                else if (currentdate - 76860000 <= date) {dates[i].innerHTML = "20 hrs ago"}
                else if (currentdate - 80520000 <= date) {dates[i].innerHTML = "21 hrs ago"}
                else if (currentdate - 84180000 <= date) {dates[i].innerHTML = "22 hrs ago"}
                else if (currentdate - 87840000 <= date) {dates[i].innerHTML = "23 hrs ago"}
                else {

                    var year = date.getFullYear();
                    var month = date.getMonth() + 1;
                    var day = date.getDate();
                    var formattedTime = day + "." + month + "." + year;

                    dates[i].innerHTML = formattedTime;

                }   
            }
        }
    }
</script>

</head>


<body onload="startTime();">

<p class="date">1483015785</p>
<p class="date">1483015786</p>
<p class="date">1483015794</p>
<p class="date">1483015984</p>
<p class="date">1483019784</p>
<p class="date">1483095784</p>
<p class="date">1489915784</p>
<p class="date">1483015927</p>
<p class="date">1483015918</p>
<p class="date">1483015917</p>
<p class="date">1483015728</p>
<p class="date">1483013928</p>
<p class="date">1483012928</p>
<p class="date">1483011928</p>
<p class="date">1483010928</p>
<p class="date">1483011428</p>
<p class="date">1483031228</p>
<p class="date">712619600</p>
<p class="date">716165789</p>
<p class="date">451616960</p>
<p class="date">567845845</p>
<p class="date">767856785</p>
<p class="date">867985764</p>

</body>
</html>

更新:

我做了一些研究,因为事实证明问题发生是因为移动版Safari会自动将某些数字转换为链接!

示例:

<p>1484234234234</p>
automatically becomes
<p><a href="tel:1484234234234">1484234234234</a></p>

至少为什么我的代码不起作用。奇怪的是,并非所有数字都会被转换,正如您可以通过以下代码找到的那样:

<!DOCTYPE html>
<html>
<head>
<script>
    function startTime() {
        var dates = document.getElementsByClassName('date');    
        for (var i = 0; i < dates.length; i++) {
            if (dates[i].innerHTML !== '') {
                var date = dates[i].innerHTML;
                alert(date);
    }}}
</script>
</head>
<body onload="startTime();">

<!--first two will be converted-->
    <p class="date">1483015785</p>
    <p class="date">1483015786</p>
<!--these two won't-->
    <p class="date">712619600</p>
    <p class="date">716165789</p>
</body>
</html>

目前我无法找到解决此问题的方法。改变&lt; p>其他东西(&lt; date&gt; f.e.)没有帮助。

1 个答案:

答案 0 :(得分:0)

通过将此行添加到我的html的头部,将阻止转换:

<meta name="format-detection" content="telephone=no" />

可能的问题:该行代表我的文档中的所有数字

这意味着如果我想在手机点击时调用数字,我需要自己突出显示它们。

此外,我也不知道这行影响还有什么。