本文目录一览:
- 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的初始时间最好是从服务器给定,然后倒计时。