军用和AM/PM onclick之间的Javascript更改时间

Javascript change time between military and AM/PM onclick

本文关键字:Javascript 时间 之间 onclick AM PM      更新时间:2023-09-26

我有一个Rails应用程序,在应用程序布局中显示实时时钟。我用这个代码使它工作:

<div id="time" class="time_display"></div>
<script type="text/javascript">
function checkTime(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}
function startTime() {
    var today = new Date();
    var h = today.getHours();
    var m = today.getMinutes();
    var s = today.getSeconds();
    // add a zero in front of numbers<10
    m = checkTime(m);
    s = checkTime(s);
    document.getElementById('time').innerHTML = h + ":" + m + ":" + s;
    t = setTimeout(function () {
        startTime()
    }, 500);
}
startTime();
</script>

我想做的是以某种方式让用户可以选择在军事时间的实时时钟和包括AM/PM的常规AM/PM时间之间切换,但点击div.

我做了一些搜索,但没有找到任何效果太好的东西。我对任何人可能拥有的解决方案持开放态度,无论是JS还是jQuery。

如有任何帮助,我们将不胜感激。如果我的问题不清楚,请告诉我。

这是代码。它只在下一次更新,但如果你想要,你可以设法修复它

function checkTime(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}
function startTime() {
    var today = new Date();
    var h = today.getHours();
    var m = today.getMinutes();
    var s = today.getSeconds();
    var ampm = h >= 12 ? 'pm' : 'am';
    // add a zero in front of numbers<10
    m = checkTime(m);
    s = checkTime(s);
    var timer = document.getElementById('time');
    if (timer.type == 'r') {
        h = h % 12;
        h = h ? h : 12;
        timer.innerHTML = h + ":" + m + ":" + s + " " + ampm;
    } else
        timer.innerHTML = h + ":" + m + ":" + s;
    t = setTimeout(function () {
        startTime()
    }, 500);
    document.getElementById('time').onclick = function () {
        if (this.type == 'r')
            this.type = 'm';
        else
            this.type = 'r';
    }
}
startTime();
<div id="time" class="time_display"></div>

真的:

var ampm = 'am';
if(hours > 11){
  ampm = 'pm';
  if(hours > 12)hours = hours-12;
}
if(hours === 0)hours = 12;

此外,你可以做一些类似的事情:

today.toLocaleString().split(',')[1];