本文目錄一覽:
- 1、html里插入兩個js,這種情況怎麼處理
- 2、倒計時JS怎麼讓它到00:00:00,計時器就停了呢?我做出來的會停止,可是刷新下又走到負數去了,求救~~~
- 3、JQuery實現的按鈕倒計時效果
- 4、JS倒計時問題
- 5、jQuery Countdown 獲取的是服務器時間還是本地時間
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-hk/n/128839.html