投稿
  1. 簡單一點首頁
  2. 編程

關於countdown.min.js的信息

R2726 • • 編程

本文目錄一覽：

html里插入兩個js,這種情況怎麼處理

合併成一個就可以了。

註：$(function(){})是 $(document).ready(function() {})的簡化寫法

$(function(){

    $(“#news-slider”).owlCarousel({

        items:3,

        itemsDesktop:[1199,2],

        itemsDesktopSmall:[980,2],

        itemsMobile:[600,1],

        pagination:false,

        navigationText:false,

        autoPlay:true

    });

    $(‘#countdown’).countDown({

        targetDate: {

        ‘day’: 5,

        ‘month’: 8,

        ‘year’: 2024,

        ‘hour’: 11,

        ‘min’: 0,

        ‘sec’: 0

        }

    });

    $(‘#email_field’).focus(email_focus).blur(email_blur);

    $(‘#subscribe_form’).bind(‘submit’, function() { return false; });

});

倒計時JS怎麼讓它到00:00:00，計時器就停了呢？我做出來的會停止，可是刷新下又走到負數去了，求救~~~

!DOCTYPE html

html

head

    meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″

    titleRunJS 演示代碼/title

    style

* {

    margin: 0;

    padding: 0

}

ul {

    margin: 10px auto;

    overflow: hidden;

    width: 120px;

    border: #cccccc solid 1px;

}

li {

    list-style: none;

    float: left;

    line-height: 26px;

    text-align: center

}

li:nth-child(1) {

    border: none

}

ul .box4 {

    border: none;

}

ul .box5 {

    border: none;

    margin-left: 0

}

ul .box6 {

    border: none;

    margin-left: 0

}

.hezi1 {

    width: 100px;

    height: 20px;

    background-color: #00F;

    margin-right: auto;

    margin-left: auto;

}

.hezi2 {

    width: 100px;

    height: 20px;

    background-color: #0F0;

    margin-right: auto;

    margin-left: auto;

    display: none

}

    /style

    script id=”jquery_180″ type=”text/javascript” class=”library” src=”/js/sandbox/jquery/jquery-1.8.0.min.js”/script

    script

        // 入口函數

        $(document).ready(function() {

            countdown();

        });

         // 定義結束時間和計時對象

        var end = new Date(“1111/1/1 17:22:59”),

            timeout;

         // 倒計時方法

        var countdown = function() {

            var now = new Date;

            var dh = Math.abs(now.getHours() – end.getHours());

            var dm = Math.abs(now.getMinutes() – end.getMinutes());

            var ds = Math.abs(now.getSeconds() – end.getSeconds());

            if (dh == 0  dm == 0  ds == 0) {

                $(“.hezi1”).hide();

                $(“.hezi2”).show();

                clearTimeout(timeout);

                return;

            }

            dh = dh  10 ? “0” + dh : dh;

            dm = dm  10 ? “0” + dm : dm;

            ds = ds  10 ? “0” + ds : ds;

            $(“.box4”).text(dh);

            $(“.box5”).text(“:” + dm);

            $(“.box6”).text(“:” + ds);

            timeout = setTimeout(countdown, 1000);

        }

    /script

/head

body

    ul

        li class=”box4″/li

        li class=”box5″/li

        li class=”box6″/li

    /ul

    div class=”hezi1″/div

    div class=”hezi2″/div

/body

/html

JQuery實現的按鈕倒計時效果

本文實例講述了JQuery實現的按鈕倒計時效果。分享給大家供大家參考，具體如下：

一個實現了在按鈕上顯示倒計時，倒計時完畢自動將按鈕設置為不可用的效果，具體代碼如下：

html

head

titletest

count

down

button/title

script

src=”jquery1.8.3.min.js”

type=”text/javascript”/script

script

type=”text/javascript”

$(function

()

{

$(‘#btn’).click(function

()

{

var

count

=

10;

var

countdown

=

setInterval(CountDown,

1000);

function

CountDown()

{

$(“#btn”).attr(“disabled”,

true);

$(“#btn”).val(“Please

wait

“

+

count

+

“

seconds!”);

if

(count

==

0)

{

$(“#btn”).val(“Submit”).removeAttr(“disabled”);

clearInterval(countdown);

}

count–;

}

})

});

/script

/head

body

input

type=”button”

id=”btn”

value=”Submit”

/

/body

/html

運行效果截圖如下：

希望本文所述對大家jQuery程序設計有所幫助。

JS倒計時問題

!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”

html

head

meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ /

title New Document /title

meta name=”Generator” content=”EditPlus”

meta name=”Author” content=”DAYU”

meta name=”Keywords” content=””

meta name=”Description” content=””

/head

body

!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”

html

head

meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ /

title New Document /title

meta name=”Generator” content=”EditPlus”

meta name=”Author” content=”DAYU”

meta name=”Keywords” content=””

meta name=”Description” content=””

/head

?=date_default_timezone_set(“Asia/Shanghai”);?!– 這裡會輸出1先不管 —

?php

//3天後的時間

$d =strtotime(‘+3 days’);

$threeday=date(‘Y-m-d H:i:s’,$d);

?

script language=”javascript”

function countdown(endtime, today)

{

//today = new Date();

//var testDate = new Date();

//today = new Date();

//target_time=new Date(endtime);

testDate = new Date();

today = testDate.format(“yyyy-MM-dd hh:mm:ss”);

target_time=endtime;

//alert(target_time);

//timeold=(target_time.getTime()-today.getTime());

//alert(target_time);

//alert(today);return;

//——————————–

timeold =DateDiff(target_time, today);

//alert(DateDiff(target_time, today));

//——————————

sectimeold=timeold/1000;

secondsold=Math.floor(sectimeold);//走到這裡好像就有問題了

msPerDay=24*60*60*1000;

e_daysold=timeold/msPerDay;

daysold=Math.floor(e_daysold);

e_hrsold=(e_daysold-daysold)*24;

hrsold=Math.floor(e_hrsold);

e_minsold=(e_hrsold-hrsold)*60;

minsold=Math.floor(e_minsold);

e_seconds=(e_minsold-minsold)*60;

seconds=Math.floor(e_seconds);

e_millisecond=(e_seconds-seconds)*1000;

millisecond=Math.floor(e_millisecond);

millisecond10=Math.floor(millisecond);

the_element = document.getElementById(‘counttime’);

the_element.innerHTML=”僅剩br “+daysold+”天”+hrsold+”小時”+minsold+”分”+seconds+”秒”;

window.setTimeout(“countdown(‘” + endtime + “‘, today)”, 100);

}

/script

BODY

tabletrtd width=”175″SPAN id=”counttime” style=”FONT-WEIGHT: bold; COLOR: #000000; FONT-FAMILY:Arial”/SPAN

script language=”javascript”

/**

* 時間對象的格式化;

*/

Date.prototype.format = function(format){

/*

* eg:format=”yyyy-MM-dd hh:mm:ss”;

*/

var o = {

“M+” : this.getMonth()+1, //month

“d+” : this.getDate(), //day

“h+” : this.getHours(), //hour

“m+” : this.getMinutes(), //minute

“s+” : this.getSeconds(), //second

“q+” : Math.floor((this.getMonth()+3)/3), //quarter

“S” : this.getMilliseconds() //millisecond

}

if(/(y+)/.test(format)) {

format = format.replace(RegExp.$1, (this.getFullYear()+””).substr(4 – RegExp.$1.length));

}

for(var k in o) {

if(new RegExp(“(“+ k +”)”).test(format)) {

format = format.replace(RegExp.$1, RegExp.$1.length==1 ? o[k] : (“00″+ o[k]).substr((“”+ o[k]).length));

}

}

return format;

}

//比較2個時間的差值

function DateDiff(dmEndDate, dmStartDate) {

dmEndDate = dmEndDate.replace(/-/g, “/”);

dmEndDate = new Date(dmEndDate)

dmStartDate = dmStartDate.replace(/-/g, “/”);

dmStartDate = new Date(dmStartDate)

var time = dmEndDate.getTime() – dmStartDate.getTime();

var iDays = parseInt(time / (1000 * 60 * 60 * 24));

return iDays

}

//*****************************************

// var endtime = “?=date(‘Y-m-d H:i:s’,time());?”;

//var testDate = new Date();

//var today = testDate.format(“yyyy年MM月dd日hh小時mm分ss秒”);

//var today = testDate.format(“yyyy-MM-dd hh:mm:ss”);

//var endtime = ‘6-2-2013 17:35:00’;

//var endtime = “?=date(‘Y-m-d H:i:s’,time());?”;

var endtime = “?=$threeday;?”;

//alert(endtime);

//var today = new Date();

var testDate = new Date();

var today = testDate.format(“yyyy-MM-dd hh:mm:ss”);

// alert(today)

//countdown(“?=date(‘Y-m-d H:i:s’,time());?”, today);

countdown(“?=$threeday;?”, today);

/script/td/tr/table

/BODY

/HTML

/body

/html

/body

/html

——————————————————-

頁面保存為PHP文件去執行.

僅剩

0天0小時0分0秒//這個結果不對,應該是2天幾分幾秒才對

jQuery Countdown 獲取的是伺服器時間還是本地時間

是本地頁面時間，前端一般獲取的都是本地時間。

JQuery CountDown裡面都是通過new Date的方式和setInterval定時方式進行的。

一般countdown的初始時間最好是從伺服器給定，然後倒計時。

原創文章，作者：R2726，如若轉載，請註明出處：https://www.506064.com/zh-tw/n/128839.html

贊 (0)
打賞 微信掃一掃 微信掃一掃 支付寶掃一掃 支付寶掃一掃
R2726的頭像R2726
0 0
上一篇 2024-10-03 23:25
下一篇 2024-10-03 23:25

相關推薦

發表回復

登錄後才能評論