秒を表示せずに.toLocaleTimeString()を使用するにはどうすればよいですか?


162

現在、秒を表示せずにユーザーの時間を表示しようとしています。JavaScriptの.toLocaleTimeString()を使用してこれを行う方法はありますか?

このようなことをする:

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

すべての単位でユーザーの時間を表示します。たとえば、現在午後3時39分15秒と表示されます。秒なしで同じ文字列を表示できますか?(例3:15 PM)

回答:


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
クロム51で動作します:new Date().toLocaleTimeString([], {hour: '2-digit', minute:'2-digit', hour12: false}); "17:08"
rofrol

1
ええ、私がこれをここに投稿してから4年になります。そのため、多くのことが変更されました。指定する必要がなくなったのも不思議ではありません。よろしく
CJLopez

10

これは私にとってはうまくいきます:

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

6
2020年3月の時点で、timeStyleオプションはChromeとOperaのみサポートされており、Firefox、Edge / IE、Safariではサポートされていないことに注意してください。広範囲をカバーしたい場合は、今のところ時間と分のオプションを使用する方が良いでしょう。
クロウメモドキ

Safari / iOSの場合、これはAM / PMがある米国でのみ機能します。en-USは15:16を表示し、他のロケールは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から返された文字列を解析しないでください。私は何年も問題なく過ごしていました。しかし、今日、私はそれが機能していないことに気づきました。Date.parseで処理できない特殊なUnicode文字(左から右へのマークである0x200Eなど)があることがわかります。それが来るのを見たことがない。それで、すべてのロケール関数の使用をやめて、自分の時間形式の文字列を作成します。それは私をこのような邪悪な驚きから救うでしょう。
Gabe Halsmer、

@GabeHalsmer-Date.parseが文字列を解析することを許可することはお勧めしません(例:ここの最後の段落)。しかし、それはここでは無関係であり、まったく言及されていません。もしそうだと思った場合、あなたは答えを誤解しています(たとえば、「解析を試みることができます…」)。
RobG

素敵なリンク。つまり、基本的にはDate.prototype.toLocalStringとDate.parseは互換性がないため、要約すると、ユーザーは独自の解析または独自のToStringメソッドを作成する必要があります。ToStringを作成することは、私にとって最も簡単なことのように思えました。しかし、あなたは自分がパースしていることを実装しました。どちらも人のために働くでしょう。私がみんなに気づかせたい本質的なことは、Date.parseがtoLocaleStringで機能しないことでした。そして、この非互換性がどれほど微妙なものであったかを突き止めるのに何時間もかかりました。左から右のマークは、Visual Studioのデバッガーでは表示されません。
Gabe Halsmer、2014年

もう1つ、まったく見当違いの反対票。人々が自分の名前をつけたくないのも不思議ではありません。
RobG 2014

日付を格納して他の形式に転送する場合、toISOStringとgetTimeは、おそらく最も安全な日付形式で再解析できます。getTimeから返されたミリ秒バージョンのUTCを処理しなかった過去10年間のJS実装については知りません。ISO値も、仕様書に記載されている時刻の解析可能な日付形式です。ただし、UI要素から日付を読み取ることはありません。それはあなたのアプリレイヤーから来るはずです。そして、常にSafariでテストしてください。彼らは日付オブジェクトについてIE6レベルのジャークでした。
Erik Reppen、2015年


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 質問に正解したのはあなただけです。ありがとうmate
mate64

1
これは、toLocaleTimeString()すべてのロケールに当てはまるわけではない戻り値について多くの仮定を行います。
AJリチャードソン

0

これを試すことができますが、これは私のニーズに合っています。

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

または

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

6
他の言語ではとはまったく異なるセパレータを使用する可能性があるため、これは機能しません:
Jon Koops

-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の内部化APIに依存する必要はありません)。 :

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

このアプローチでは、正規表現の先読みを使用して文字列の:ss AM / PMの終わりを取得し、:ssの部分をスペースに置き換えて、残りの文字列をそのまま返します。(文字通り「2桁のコロンと、それに続くAMまたはPMのいずれかが続くスペースを探し、コロン、2桁、スペースの部分をスペースだけで置き換えます」と言います。)

この式/アプローチは、en-USおよびen-USのようなロケールでのみ機能します。AM / PMを使用しないイギリス英語(en-GB)などでも同様の結果が必要な場合は、別の正規表現が必要です。

元の質問者のサンプル出力に基づいて、私は彼らが主にアメリカ人の聴衆とen-USタイムスキーマを扱っていたと思います。


-3

日付を文字列に変換し、必要な部分文字列を連結します。

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

3
投稿に説明を追加してください。
DigitCart 2018年

5
toLocaleTimeStringロケール設定に応じて、ブラウザごとに異なる文字列を返します。これらの位置に依存することはできません。他の人のブラウザでは、異なる、おそらく壊れた結果が得られます。
oriadam
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.