jQuery+PHP動態顯示(項目)實時時間和倒計時


jQuery動態顯示當前時間:
    html代碼:<div id="current_time"></div>

setInterval()使用:setInterval(functionName,timeOut);

setInterval使用示例:
    jQuery代碼:

  <script type="text/javascript">
    setInterval(function() {
        var now = (new Date()).toLocaleString();
        $('#current-time').text(now);
    }, 1000);
  </script>

 

 

 

整合示例教程-->jQuery+PHP動態顯示項目倒計時:

html代碼:

            <ul class="public-time-left">
                <li><p id="time_d"></p><span>天</span></li>
                <li><p id="time_h"></p><span>小時</span></li>
                <li><p id="time_m"></p><span>分</span></li>
                <li><p id="time_s"></p><span>秒</span></li>
            </ul>

  

PHP代碼:  //以TP框架為例,將php后台數據【項目截止時間】傳到前端

$this->assign("endtime",$end_time);     //不是時間戳,是格式化后的時間,方便js計算

 

jQuery代碼:

//比如寫在一個.js文件里,在html頁面引入即可。

/*倒計時*/
function GetRTime(){
    var voere=voertime;    
//不是時間戳,是格式化后的時間,方便js計算
var EndTime= new Date(voere); var NowTime = new Date(); var t =EndTime.getTime() - NowTime.getTime(); var d=0; var h=0; var m=0; var 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); } document.getElementById("time_d").innerHTML = d ; document.getElementById("time_h").innerHTML = h ; document.getElementById("time_m").innerHTML = m ; document.getElementById("time_s").innerHTML = s ; }

 

  

最后一步:在html頁面的腳本里調用引入js的GetRTime方法

/* setInterval()很重要:作用是每隔一定時間就調用函數,方法或對象。 */

 

<script type="text/javascript">var voertime = '{$deal_info.over_time}';    //php的截止時間,不是時間戳,是格式化后的時間,方便js計算
 {if ($deal_info.end_time > $now or $deal_info.end_time eq 0) and $deal_info.begin_time < $now and $deal_info.is_effect eq 1 } setInterval(GetRTime,0); {/if} </script>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM