時計のフォーマットを変更するチェックボックス

Question

チェックボックスをオンまたはオフにすることで、PM/AMで24時間から12時間にフォーマットを変更できるテキストクロックを作成します。このコードを作成する手助けはできますか？ここで

は、私が今持っているものです。

function GetClock() { 
 
    var d = new Date(); 
 
    var nhour = d.getHours(), 
 
    nmin = d.getMinutes(); 
 
    if (nmin <= 9) nmin = "0" + nmin 
 

 
    document.getElementById('clockbox').innerHTML = "" + nhour + ":" + nmin + ""; 
 
} 
 

 
window.onload = function() { 
 
    GetClock(); 
 
    setInterval(GetClock, 1000); 
 
}

@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:700'); 
 

 
#clockbox { 
 
    display: inline-block; 
 
    width: auto; 
 
    color: black; 
 
    position: fixed; 
 
    top: 38%; 
 
    left: 38%; 
 
    font-size: 10vw; 
 
    font-family: 'Roboto Condensed', sans-serif; 
 
}

<div id="clockbox"></div>

Answer 1

var clockFormat = 24; 
 
function GetClock(){ 
 
var d=new Date(); 
 
var nhour=d.getHours(),nmin=d.getMinutes(); 
 
if(nmin<=9) nmin="0"+nmin 
 

 
if (clockFormat == 12 && nhour > 12){ 
 
    nhour -=12; 
 
    nmin+= " PM"; 
 
}else { 
 
    if (clockFormat == 12){ 
 
     nmin+= " AM"; 
 
    } 
 
    
 
    } 
 
    
 
document.getElementById('clockbox').innerHTML=""+nhour+":"+nmin+""; 
 
} 
 

 
window.onload=function(){ 
 
GetClock(); 
 
setInterval(GetClock,1000); 
 
} 
 

 
function setFormat(format){ 
 
clockFormat = format; 
 
}

@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:700'); 
 
#clockbox{ 
 
    display: inline-block; 
 
    width: auto; 
 
    color:#fff; 
 
    position:fixed; 
 
    top:38%; 
 
    left:38%; 
 
    font-size: 10vw; 
 
    font-family:'Roboto Condensed', sans-serif; 
 

 
} 
 
body{ 
 
    color:#fff; 
 
    background-color:black; 
 
}

<div id="clockbox"></div> 
 
    <input type="radio" name="format" value="24" onChange="setFormat(this.value)" checked="checked"> Format 24<br> 
 
    <input type="radio" name="format" value="12" onChange="setFormat(this.value)">Format 12<br>