利用jquery如何在網(wǎng)頁中顯示時間？

在網(wǎng)頁中動態(tài)顯示時間，需要先獲取時間，然后更新時間，因此需要使用以下兩個函數(shù)

網(wǎng)站建設(shè)哪家好，找創(chuàng)新互聯(lián)公司！專注于網(wǎng)頁設(shè)計、網(wǎng)站建設(shè)、微信開發(fā)、小程序設(shè)計、集團企業(yè)網(wǎng)站建設(shè)等服務(wù)項目。為回饋新老客戶創(chuàng)新互聯(lián)還提供了襄城免費建站歡迎大家使用！

獲取時間

var?myDate=new?Date();?????????//?Date?對象用于處理日期和時間

利用定時器更新時間

setTimeout(code,millisec);????//?在指定的毫秒數(shù)后調(diào)用函數(shù)

實例演示如下

創(chuàng)建Html元素

div?class="box"

span利用javascript定時器顯示時間/spanbr

div?class="content"

span?id="clock"/span

/div

/div

設(shè)置css樣式

div.box{width:300px;padding:20px;margin:20px;border:4px?dashed?#ccc;}

div.boxspan{color:#999;font-style:italic;}

div.content{width:250px;margin:10px?0;padding:20px;border:2px?solid?#ff6666;}

編寫jquery代碼

//?定義獲取和更新時間的函數(shù)

function?showTime()?{

var?curTime?=?new?Date();

$("#clock").html(curTime.toLocaleString());

setTimeout("showTime()",?1000);

}

//?頁面加載完成后執(zhí)行上面的自定義函數(shù)

$(function(){

showTime()

})

觀察效果

某一個時刻的截圖

過幾秒后的截圖

jquery 時間顯示出來

在層上面建立個class或name或其他字段。其中的值就為時間。

讓后點擊的時候

function showTime(obj){

t=$(obj).attr("class");

$("#date").val(t);

}

在輸入框中加入單擊事件

input id="date" onclick='showTime(this)' type="text" /

這樣就可以了。

jquery如何讓時間只顯示年月

div?id="nowTime"/div?

script?type="text/javascript"?src="jquery.js"/script

script?type="text/javascript"?

function?current(){?

var?d=new?Date(),str='';?

str?+=d.getFullYear()+'年';?//獲取當(dāng)前年份?

str?+=d.getMonth()+1+'月';?//獲取當(dāng)前月份（0——11）?

//str?+=d.getDate()+'日';?

//str?+=d.getHours()+'時';?

//str?+=d.getMinutes()+'分';?

//str?+=d.getSeconds()+'秒';?

return?str;

}?

setInterval(function(){

$("#nowTime").html(current)

},1000);?//顯示時分秒，并且秒數(shù)可以跳動

//$("#nowTime").html(current);

/script

用jquery編寫12小時制顯示當(dāng)前系統(tǒng)時間

function?nowTime(ev,type){?

/*?

*?ev:顯示時間的元素?

*?type:時間顯示模式.若傳入12則為12小時制,不傳入則為24小時制?

*/

//年月日時分秒?

var?Y,M,D,W,H,I,S;?

//月日時分秒為單位時前面補零?

function?fillZero(v){?

if(v10){v=0+v;}?

return?v;?

}?

(function(){?

var?d=new?Date();?

var?Week=[星期天,星期一,星期二,星期三,星期四,星期五,星期六];?

Y=d.getFullYear();?

M=fillZero(d.getMonth()+1);?

D=fillZero(d.getDate());?

W=Week[d.getDay()];?

H=fillZero(d.getHours());?

I=fillZero(d.getMinutes());?

S=fillZero(d.getSeconds());?

//12小時制顯示模式?

if(type??type==12){?

//若要顯示更多時間類型諸如中午凌晨可在下面添加判斷?

if(H=12){?

H=上午?+H;?

}else?if(H12??H24){?

H-=12;?

H=下午?+fillZero(H);?

}else?if(H==24){?

H=下午?00;?

}?

}?

ev.innerHTML=Y+年+M+月+D+日?+?+W+?+H+:+I+:+S;?

//每秒更新時間?

setTimeout(arguments.callee,1000);?

})();?

}

如何用jquery在頁面顯示時間

如下：

一、引入jquery

二、HTML代碼

三、js代碼

1）引入js代碼

2）下面是完整的js代碼