2016-10-17 1 views
0

Ich habe eine digitale Uhr auf meiner Seite mit Javascript erstellt und möchte sie von der Militärzeit in die Standardzeit ändern. Ich will nur, dass es auch die Stunden und Minuten anzeigt. Was soll ich tun, um dies zu implementieren?Wie ändere ich meine Javascript-Digitaluhr von Militärzeit auf Standardzeit?

body { 
 
    background-color: black; 
 
    margin-left: 5%; 
 
    margin-right: 5%; 
 
} 
 

 
#txt { 
 
    color: white; 
 
    float: left; 
 
    font-family: OpenSans; 
 
    font-size: 90px; 
 
    margin: 20px; 
 
} 
 

 
#weather { 
 
    color: white; 
 
    float: right; 
 
    font-family: OpenSans; 
 
    font-size: 40px; 
 
    margin: 20px; 
 
}
<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <title>Blooming Time And Temperature</title> 
 
    <link href="css/format.css" rel="stylesheet"/> 
 
    <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"> 
 
    <script> 
 
    function startTime() { 
 
     var today = new Date(); 
 
     var h = today.getHours(); 
 
     var m = today.getMinutes(); 
 
     var s = today.getSeconds(); 
 
     m = checkTime(m); 
 
     s = checkTime(s); 
 
     document.getElementById('txt').innerHTML = 
 
     h + ":" + m + ":" + s; 
 
     var t = setTimeout(startTime, 500); 
 
    } 
 
    function checkTime(i) { 
 
     if (i < 10) {i = "0" + i}; // add zero in front of numbers < 10 
 
     return i; 
 
    } 
 
    </script> 
 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> 
 
    <script src="js/jquery.simpleWeather.min.js"></script> 
 
    <script> 
 
     $(document).ready(function() { 
 
     $.simpleWeather({ 
 
      location: 'Brooklyn, NY', 
 
      woeid: '', 
 
      unit: 'f', 
 
      success: function(weather) { 
 
      html = '<p>'+weather.temp+'&deg;'+weather.units.temp+'</p>'; 
 
      html += '<div id="city">'+weather.city+', '+weather.region+'</div>'; 
 

 
      $("#weather").html(html); 
 
      }, 
 
      error: function(error) { 
 
      $("#weather").html('<p>'+error+'</p>'); 
 
      } 
 
     }); 
 
     }); 
 
    </script> 
 
    </head> 
 
    <body onload="startTime()"> 
 
    <div id="txt"></div> 
 
    <div id="weather"></div> 
 
    </body> 
 
</html>

+2

'if (h> 12) h = h-12;' – j08691

+0

was etwa 0 :) –

+0

Es tut mir leid, Jungs, ich bin völlig neu zu Javascript und mein Professor nur hat uns diese Uhraufgabe als eine Woche Übung gegeben, ich weiß nicht, worauf man sich bezieht oder was ihr leider meint. :( –

Antwort

0

Wenn Sie offen sind ein Plugin wie Moment, es zu verwenden wäre ziemlich einfach.

MomentJs ist ein ziemlich praktisches und nützliches Plugin, um mit Datum und Uhrzeit umzugehen.

var timeOut; 
 
function startTime() { 
 
    document.getElementById('txt').innerHTML = 
 
    moment().format("hh:mm:ss A"); 
 
    clearTimeout(timeOut); 
 
    timeOut = setTimeout(startTime, 1000); 
 
} 
 

 
$(document).ready(function() { 
 
    startTime(); 
 
    $.simpleWeather({ 
 
    location: 'Brooklyn, NY', 
 
    woeid: '', 
 
    unit: 'f', 
 
    success: function(weather) { 
 
     html = '<p>' + weather.temp + '&deg;' + weather.units.temp + '</p>'; 
 
     html += '<div id="city">' + weather.city + ', ' + weather.region + '</div>'; 
 

 
     $("#weather").html(html); 
 
    }, 
 
    error: function(error) { 
 
     $("#weather").html('<p>' + error + '</p>'); 
 
    } 
 
    }); 
 
});
body { 
 
    background-color: black; 
 
    margin-left: 5%; 
 
    margin-right: 5%; 
 
} 
 
#txt { 
 
    color: white; 
 
    float: left; 
 
    font-family: OpenSans; 
 
    font-size: 90px; 
 
    margin: 20px; 
 
} 
 
#weather { 
 
    color: white; 
 
    float: right; 
 
    font-family: OpenSans; 
 
    font-size: 40px; 
 
    margin: 20px; 
 
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.simpleWeather/3.1.0/jquery.simpleWeather.min.js"></script> 
 
<div id="txt"></div> 
 
<div id="weather"></div>

+0

Rob das beantwortet meine Frage! Es war super hilfreich. Es tut mir leid, wenn ich mich nicht klarer erklären und entschuldige mich für jede Verwirrung. Das einzige, was ich bin Ich weiß immer noch nicht, wie man die Sekunden von der Uhr entfernt, aber das ist genau das, was ich brauchte! –

+0

Oh Entschuldigung, lass mich erklären, Rob, unser Professor möchte, dass wir Plugins verwenden, da diese Klasse (und diese Aufgabe) nicht über Design ist Ich kenne HTML und CSS, aber im Moment habe ich überhaupt keine Javascriptkenntnisse, um zu wissen, wie ich das selbst implementieren kann.Wir werden über das Design benotet und das funktioniert, nicht dass wir unseren eigenen Code benutzt haben. –

0

Der Kommentar von j08691 korrekt ist, aber ich werde die AM/PM-Informationen hinzufügen:

var AMPM = (h >= 12)? " PM":" AM"; 
if (h > 12) h = h - 12; 
if (h < 1) h = h + 12; 
document.getElementById('txt').innerHTML = h + ":" + m + ":" + s + AMPM; 
Verwandte Themen