結(jié)婚亭罪,幾乎是每個(gè)女人的必經(jīng)之路。很多女人在經(jīng)過(guò)漫長(zhǎng)的戀愛(ài)過(guò)程之后歼秽,終于修成正果应役,步入婚禮的殿堂。這燥筷,是令人羨慕的箩祥。同樣的,期待心砰砰砰肆氓,袍祖,只希望婚姻并不是墳?zāi)梗暂p松谢揪、快樂(lè)的心情去迎接屬于自己的幸福蕉陋。
倒計(jì)時(shí) 303天.....
作為一個(gè)職業(yè)的碼農(nóng),怎么樣用js去編寫一個(gè)倒計(jì)時(shí)呢拨扶?時(shí)時(shí)刻刻提醒讓男朋友知道如何面對(duì)那一天的來(lái)臨凳鬓,做到時(shí)刻提醒!患民!
2.png
首先在html的body里寫上內(nèi)容缩举!
<form>目的日期:
<input type="text" id="year"><span>年</span>
<input type="text" id="month"><span>月</span>
<input type="text" id="day"><span>日</span>
<input type="text" id="hour"><span>時(shí)</span>
<input type="text" id="minute"><span>分</span>
<input type="text" id="second"><span>秒</span>
<input type="button" value="確定" onclick="show()">
</form>
<div class="time1">還剩時(shí)間:
<span id="1"></span>天
<span id="2"></span>時(shí)
<span id="3"></span>分
<span id="4"></span>秒
</div>
然后在html的head里寫上內(nèi)容!
<style>
input {
width: 50px;
height: 20px;
border: 1px solid black;
}
.time1 span {
display: inline-block;
width: 40px;
height: 20px;
}
</style>
看一下實(shí)現(xiàn)的效果吧匹颤!
image.png
怎么樣能夠讓他實(shí)現(xiàn)倒計(jì)時(shí)的效果呢仅孩!就可以在html的body里開(kāi)始編寫上script內(nèi)容!
function show(){
//獲取目的日期
var myyear=document.getElementById("year").value;
var mymonth=document.getElementById("month").value-1;
var myday=document.getElementById("day").value;
var myhour=document.getElementById("hour").value;
var myminute=document.getElementById("minute").value;
var mysecond=document.getElementById("second").value;
var time=Number(newDate(myyear,mymonth,myday,myhour,myminute,mysecond));
//獲取當(dāng)前時(shí)間
var nowTime=Date.now();
//獲取時(shí)間差
var timediff=Math.round((time-nowTime)/1000);
//獲取還剩多少天
var day=Math.floor(difference / 1000 / 60 / 60 / 24);
//獲取還剩多少小時(shí)
var hour=Math.floor(difference / 1000 / 60 /60 % 24);
//獲取還剩多少分鐘
var minute=Math.floor(difference / 1000 /60 % 60);
//獲取還剩多少秒
var second=Math.floor(difference / 1000 % 60);
//輸出還剩多少時(shí)間
document.getElementById("1").innerHTML=day;
document.getElementById("2").innerHTML=hour;
document.getElementById("3").innerHTML=minute;
document.getElementById("4").innerHTML=second;
//定時(shí)器循環(huán)
setTimeout(show,1000);
一起看下結(jié)果吧印蓖!
image.png
ps:希望又個(gè)辦法插入到 男朋友手機(jī)屏幕辽慕,時(shí)時(shí)刻刻提醒他,是時(shí)候踏著七彩祥云來(lái)娶
我啦A砦椤1前佟!0诔ⅰ!R虮6楣!;瘟铡Q都臁K雎场!
9180e329f8d1ac3d27fd4219d49004ea.jpg