js 倒计时 本地端获取时间 和获取服务器端时间
1.本地端JS 获取时间
JS代码 JQuery
<script type="text/javascript">
function GetRTime(){
var EndTime= new Date('2015/05/20 00:00:00');
var NowTime = new Date();
var t =EndTime.getTime() - NowTime.getTime();
var d=0,h=0,m=0,s=0;
if(t>0){
d=Math.floor(t/1000/60/60/24);
h=Math.floor(t/1000/60/60%24);
m=Math.floor(t/1000/60%60);
s=Math.floor(t/1000%60);
if(d<10){
d="0"+d;
}
if(h<10){
h="0"+h;
}
if(m<10){
m="0"+m;
}
}
else{
d='00';
h='00'
m='00'
}
$("#t_d").html(d);
$("#t_h").html(h);
$("#t_m").html(m);
/* document.getElementById("t_d").innerHTML = d ;
document.getElementById("t_h").innerHTML = h ;
document.getElementById("t_m").innerHTML = m ;
document.getElementById("t_s").innerHTML = s ;*/
}
setInterval(GetRTime,0);
HTML
<div class="time" style="position: absolute; top: 100px; left: 990px;color: #fff;font-size: 24px;">
<span id="t_d" style="letter-spacing: 6px; margin-left:2px;">00</span>
<span id="t_h" style="margin-left: 20px;letter-spacing: 8px;">00</span>
<span id="t_m" style="margin-left: 20px;letter-spacing: 8px;">00</span>
</div>
2. 获取服务器端的时间 根据接口
可以返回几种服务器时间格式
http://www.no5.com.cn/getservertime.asp
http://www.no5.com.cn/getservertime.asp?f=utc
http://www.no5.com.cn/getservertime.asp?f=date
这里就说下 就要考虑跨域的问题
同端口 同协议 同域名
没有跨域的情况
var servertime =$.ajax(
{
type:"get",
url:"/getservertime.asp",
success: function(data){
return data; //返回的格式比如这样 2015-5-12 16:12:16 然后转化成日期格式2015/5/12 16:12:16
console.log( data.replace(/-/g,"/")); //替换- 为 /
console.log(new Date(data.replace(/-/g,"/")));
console.log(new Date(data.replace(/-/g,"/")).getTime());//获取毫秒数
} } );
下面是完整例子
JS代码
<script type="text/javascript">
var servertime ;//定义全局变量接收
function GetRTime(){
//每一秒调用GetRTime 函数 同时ajax返回服务器时间
$.ajax({
type:"get",
url:"/getservertime.asp",
async:false,
success:function(data){
servertime = new Date(data.replace(/-/g,"/")).getTime();
}
})
var EndTime= new Date('2015/05/20 00:00:00'); //定义结束时间
var NowTime = servertime;// 接收服务器时间
var t =EndTime.getTime() - NowTime; //获取剩余时间差值毫秒数
var d=0, h=0, m=0, s=0; //定义天 时 分 秒 变量
if(t>0){
d=Math.floor(t/1000/60/60/24);
h=Math.floor(t/1000/60/60%24);
m=Math.floor(t/1000/60%60);
s=Math.floor(t/1000%60);
//个位数的时候前面加0
if(d<10){
d="0"+d;
}
if(h<10){
h="0"+h;
}
if(m<10){
m="0"+m;
}
}
else{
//结束后归0
d='00'; h='00' m='00'
}
$("#t_d").html(d);
$("#t_h").html(h);
$("#t_m").html(m);
}
setInterval(GetRTime,0);
</script>
HTML
<div class="time" style="position: absolute; top: 100px; left: 990px;color: #fff;font-size: 24px;"> <span id="t_d" style="letter-spacing: 6px; margin-left:2px;">00</span> <span id="t_h" style="margin-left: 20px;letter-spacing: 8px;">00</span> <span id="t_m" style="margin-left: 20px;letter-spacing: 8px;">00</span> </div>
下面主要讲讲jsonp 跨域的请求
jquery

浙公网安备 33010602011771号