我如何改变我的Javascript数字时钟从军事时间到标准时间
How Do I Change My Javascript Digital Clock from Military Time to Standard Time?
我用Javascript在我的网站上创建了一个数字时钟,并想将其从军事时间更改为标准时间。我只是希望它也能显示小时和分钟。我应该做些什么来实现这一点?
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+'°'+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>
如果你是开放使用插件的时刻,这将是相当简单的。
MomentJs是一个非常方便和有用的插件来处理日期和时间。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 + '°' + 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>
j08691的评论是正确的,但是我将添加AM/PM信息:
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;
相关文章:
- 谷歌分析/Mixpanel/等.确定时钟错误时的事件时间戳
- 如何设置此javascript以正确显示花费的总时间,显示超出正常时钟的分钟数
- 24小时时钟中的时间轴
- 如何在时间和子午线(AM?PM)在时钟选择器中
- 在 aspx 页上显示实时时钟(使用服务器时间)
- 来自 MySQL 数据库的翻转时钟时间值,刷新时不会重置
- Javascript时间计数器与翻转时钟
- Javascript时钟,改变时间
- 如何创建具有自定义输入时间的 Javascript 时钟
- 带有服务器时间PHP的Javascript时钟
- 当用户在 JavaScript 中选择新时间时,继续单击时钟
- 在JSP屏幕上显示动态UTC时钟时间
- Backbone/Javascript中的按24小时时钟时间自定义排序
- 我的javascript时钟赢了't显示时间
- 扩展时钟组件的角度指令以单独显示日期时间元素
- PHP,Javascript实时时钟:如何正确显示数据库上次更新的时间
- 简单的时间-时钟不工作没有错误
- JavaScript异步时钟从服务器时间戳
- JavaScript时钟:时间间隔冲突
- jQuery在时钟时间自动刷新页面