如何在不显示秒的情况下使用.toLocaleTimeString()?


162

我目前正在尝试显示用户的时间而不显示秒数。有没有办法使用Javascript的.toLocaleTimeString()?

做这样的事情:

var date = new Date();
var string = date.toLocaleTimeString();

将显示每个单位的用户时间,例如当前显示3:39:15 PM。我能显示相同的字符串,而无需秒吗?(例如下午3:39)

Answers:


316

您始终可以根据此页面设置选项,以摆脱秒表,例如:

var dateWithouthSecond = new Date();
dateWithouthSecond.toLocaleTimeString([], {hour: '2-digit', minute:'2-digit'});

受Firefox,Chrome,IE9 +和Opera支持。在您的Web浏览器控制台上尝试一下。


2
谢谢,我一直在寻找这个答案的时间。
MustafaP 2014年

5
仅供参考hour: "2-digit",我无法在Chrome 42和FF 37中为我工作- 两者都d = new Date(1429524912495).toLocaleTimeString('en-US', {hour: '2-digit', minute: '2-digit', hour12: true})返回"6:15 AM"
user9645 2015年

16
用于[]省略特定的语言环境。这样,您就可以保留在用户所在的语言环境中:toLocaleTimeString([], {hour: '2-digit', minute: '2-digit'}
Hafenkranich

12
在chrome 51中工作:new Date().toLocaleTimeString([], {hour: '2-digit', minute:'2-digit', hour12: false}); "17:08"
rofrol

1
是的,距离我在这里发布此消息已有4年了,所以很多事情已经改变了。难怪您不再需要指定它。问候
CJLopez '17

10

这对我有用:

var date = new Date();
var string = date.toLocaleTimeString([], {timeStyle: 'short'});

6
值得注意的是,从2020年3月开始,仅Chrome和Opera中支持timeStyle选项,而Firefox,Edge / IE和Safari中不支持timeStyle选项。如果您想要广泛的覆盖范围,最好暂时保留小时和分钟选项。
鼠李

对于Safari / iOS,这仅在具有AM / PM的美国有效。en-US将显示3:16 PM,其他区域将显示15:16:00。
PassKit

8

Date.prototype.toLocaleString返回的值取决于实现,因此您可以得到所得到的。您可以尝试解析字符串以删除秒数,但是在不同的浏览器中它可能有所不同,因此您需要为使用中的每个浏览器留出余地。

使用Date方法创建自己明确的格式并不困难。例如:

function formatTimeHHMMA(d) {
  function z(n){return (n<10?'0':'')+n}
  var h = d.getHours();
  return (h%12 || 12) + ':' + z(d.getMinutes()) + ' ' + (h<12? 'AM' :'PM');
}

7
不要解析从toLocaleTimeString返回的字符串。我已经有几年没有任何问题了。但是今天我注意到它没有用。原来有一些特殊的Unicode字符(例如0x200E,从左到右的标记),Date.parse无法处理。从来没有看到那来。因此,我将停止使用所有语言环境功能,而只是构造自己的时间格式字符串。这将使我免于遭受像这样的邪恶惊喜。
·霍尔斯默

@GabeHalsmer-我从未(也从来没有)建议允许Date.parse解析字符串(例如,此处的最后一段)。但这无关紧要,根本没有提及,如果您认为答案是错误的,那么您就会误解了答案(例如“ 可以尝试解析……”)。
RobG 2014年

好的链接。因此,总而言之,人们必须进行自己的解析或自己的ToString方法,因为从根本上说Date.prototype.toLocalString和Date.parse是不兼容的。制作ToString似乎是我最容易做的事情。但是您已经实现了自己的解析。因此,两者都会为人们服务。我想让所有人都知道的最重要的事情是Date.parse不适用于toLocaleString。由于它的微妙之处,我花了几个小时来查找这种不兼容。从左到右标记在Visual Studio的调试器中不可见。
Gabe Halsmer 2014年

很酷,又一次完全被误导了。难怪人们不想给他们起名字。
RobG 2014年

为了将日期存储和传输为其他格式,toISOString和getTime可能提供了最安全的日期格式来进行解析。我不知道过去十年中没有任何JS实现不处理从getTime返回的毫秒版本的UTC,并且ISO值也已成为规范的可解析日期格式。但是永远不要从UI元素中读取日期。那应该来自您的应用程序层。并始终在Safari中进行测试。他们是有关日期对象的IE6级别的混蛋。
Erik Reppen


0

我也一直在寻找解决这个问题的方法,这是我最终想到的:

function getTimeStr() {
    var dt = new Date();
    var d = dt.toLocaleDateString();
    var t = dt.toLocaleTimeString();
    t = t.replace(/\u200E/g, '');
    t = t.replace(/^([^\d]*\d{1,2}:\d{1,2}):\d{1,2}([^\d]*)$/, '$1$2');
    var result = d + ' ' + t;
    return result;
}

您可以在这里尝试:http : //jsfiddle.net/B5Zrx/

\ u200E是我在某些IE版本上看到的某种格式设置字符(它是unicode的从左到右标记)。

我假设如果格式化的时间包含“ XX:XX:XX”之类的内容,那么时间必须是秒,并且我删除了最后一部分,如果找不到该模式,则什么都不会改变。相当安全,但是在某些奇怪的情况下有留下几秒钟的风险。

我只希望没有可以更改格式化时间部分顺序的语言环境(例如,使其为ss:mm:hh)。这个从左到右的标记让我对此有些不安,这就是为什么我不删除从右到左的标记(\ u202E)-在这种情况下,我宁愿找不到匹配项并留下在这种情况下,时间格式以秒为单位。


1
+1您是唯一回答正确问题的人。谢谢队友
mate64 2014年

1
toLocaleTimeString()对于在所有语言环境下可能都不正确的返回值做出了很多假设。
AJ理查森

0

您可以尝试一下,这符合我的需求。

var d = new Date();
d.toLocaleTimeString().replace(/:\d{2}\s/,' ');

要么

d.toLocaleString().replace(/:\d{2}\s/,' ');

6
这将行不通,因为其他语言可能会使用与完全不同的分隔符:
乔恩·库普斯

-2

这是一个将执行此功能的函数,并带有解释说明的注释:

  function displayNiceTime(date){
    // getHours returns the hours in local time zone from 0 to 23
    var hours = date.getHours()
    // getMinutes returns the minutes in local time zone from 0 to 59
    var minutes =  date.getMinutes()
    var meridiem = " AM"

    // convert to 12-hour time format
    if (hours > 12) {
      hours = hours - 12
      meridiem = ' PM'
    }
    else if (hours === 0){
      hours = 12
    }

    // minutes should always be two digits long
    if (minutes < 10) {
      minutes = "0" + minutes.toString()
    }
    return hours + ':' + minutes + meridiem
  }

正如其他人所指出的那样,由于toLocaleTimeString()可以在不同的浏览器中以不同方式实现,因此这种方式可以提供更好的控制。

要了解有关Javascript Date对象的更多信息,这是一个很好的资源:https : //developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date


-2

我认为,最初的问题很容易解决,而到目前为止却被忽略了:简单的字符串拆分。返回的时间是一个文本字符串,只需在“:”定界符上将其分割,然后按照所需的方式重新组装该字符串。没有插件,没有复杂的脚本。和你去:

var myVar=setInterval(function(){myTimer()},1000);

function myTimer() {
    var d = new Date();
    currentNow = d.toLocaleTimeString();
    nowArray = currentNow.split(':');
    filteredNow = nowArray[0]+':'+nowArray[1];
    document.getElementById("demo").innerHTML = filteredNow;
}

-3

尽管这是一个比较老的问题,但我本人最近也遇到了同样的问题,并提出了一个使用正则表达式和字符串替换函数作为另一种选择的更简单的解决方案(不需要外部js库或依赖ECMAScript Internalization API) :

var d = new Date();
var localeTime = d.toLocaleTimeString();
var localeTimeSansSeconds = localeTime.replace(/:(\d{2}) (?=[AP]M)/, " ");

这种方法使用正则表达式预读来捕获字符串的:ss AM / PM末尾,并用空格替换:ss部分,使其余的字符串保持不变。(从字面上说:“用两个数字和一个空格(后面跟AM或PM)查找冒号,并用一个空格替换冒号,两个数字和空格部分)。

此表达式/方法仅适用于en-US和类似en-US的语言环境。如果您还希望使用不使用AM / PM的英式英语(en-GB)获得类似的结果,则需要使用其他正则表达式。

基于原始提问者的样本输出,我认为他们主要是在与美国受众和美国时间架构打交道。


-3

只需将日期转换为字符串,然后将所需的子字符串连接起来即可。

let time = date.toLocaleTimeString();
console.log(time.substr(0, 4) + time.substr(7, 3))
//=> 5:45 PM

3
请在您的帖子中添加一些说明。
DigitCart

5
toLocaleTimeString根据区域设置,在每个浏览器上返回不同的字符串。您不能依靠这些位置,在其他人的浏览器上会得到不同的结果,可能是坏的结果。
oriadam '18
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.