                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /倒计时效果

为什么我把2个例子写在1个html文档里就不行了

<!DOCTYPE html>

<html>

<style>

.holiday{ font-size:16px ;}

.holiday #hdate{ font-size: 20px; color: red;}

</style>

<head>

</head>

<body>

在这里显示时间

</div>

<p class="holiday">距离放假还有<span id="hdate"></span>天</p>

window.onload = function st(){

var year = new Date().getFullYear();

var month = new Date().getMonth()+1;

var day = new Date().getDate();

var w = new Date().getDay()

var cweek =new Array(7)

cweek[0]="星期日"

cweek[1]="星期一"

cweek[2]="星期二"

cweek[3]="星期三"

cweek[4]="星期四"

cweek[5]="星期五"

cweek[6]="星期六"

var h = new Date().getHours();

var m = new Date().getMinutes();

var s = new Date().getSeconds();

document.getElementById("showtime").innerHTML =year+"年"+month+"月"+day+"日" +cweek[w]

+ h +"时" + m +"分"+ s+"秒";

setTimeout(st,500)

}

window.onload=function ht()

{

var endtime = new Date(2016,6,29)

var todaytime = new Date();

var lefttime = endtime - todaytime

}

</script>

</body>

</html>

a0a9l1

2016-07-06

源自：倒计时效果 2-1

关注问题我要回答

1016

操作

收起

3 回答

singerow 回答被采纳 +3 积分
2016-07-06

window.onload方法表示在界面加载完成之后，执行function里面的程序。它不能在同一界面中写两次。

0 回复有任何疑惑可以回复我~

收起回答

a0a9l1 提问者
2016-07-07

	<script>
		window.onload = function st(){
			var year = new Date().getFullYear();
			var month = new Date().getMonth()+1;
			var day =  new Date().getDate();
			
			var w = new Date().getDay()
			var cweek =new Array(7)
				cweek[0]="星期日"
				cweek[1]="星期一"
				cweek[2]="星期二"
				cweek[3]="星期三"
				cweek[4]="星期四"
				cweek[5]="星期五"
				cweek[6]="星期六"
			
			var h = new Date().getHours();
			var m = new Date().getMinutes();
			var s = new Date().getSeconds();
			
			document.getElementById("showtime").innerHTML =year+"年"+month+"月"+day+"日" +cweek[w]
			+ h +"时" + m +"分"+ s+"秒";
		setTimeout(st,500)
		}
	    
	    
	     function ht()
	    {
	    	var endtime = new Date(2016,6,29)
	    	var todaytime = new Date();
	   		var lefttime = Math.ceil((endtime.getTime() - todaytime.getTime())/(24*60*60*1000))
	   		   		
	    }
		</script>

我就是这么写的但是效果还是没有实现

0 回复有任何疑惑可以回复我~

收起回答

湛瞳

我把你的代码复制下来，首先是可以运行的，但是你倒计时的函数并没有进行调用，怎么可能会有效果呢

2016-08-29 回复有任何疑惑可以回复我~

singerow
2016-07-06

可以吧ht写成一个单独的函数，然后在onload中调用：

<!DOCTYPE html>

<html>

<style>

.holiday{ font-size:16px ;}

.holiday #hdate{ font-size: 20px; color: red;}

</style>

<head>

</head>

<body>

在这里显示时间

</div>

<p class="holiday">距离放假还有<span id="hdate"></span>天</p>

window.onload = function st(){

var year = new Date().getFullYear();

var month = new Date().getMonth()+1;

var day = new Date().getDate();

var w = new Date().getDay()

var cweek =new Array(7)

cweek[0]="星期日"

cweek[1]="星期一"

cweek[2]="星期二"

cweek[3]="星期三"

cweek[4]="星期四"

cweek[5]="星期五"

cweek[6]="星期六"

var h = new Date().getHours();

var m = new Date().getMinutes();

var s = new Date().getSeconds();

document.getElementById("showtime").innerHTML =year+"年"+month+"月"+day+"日" +cweek[w]

+ h +"时" + m +"分"+ s+"秒";

setTimeout(st,500)

setTimeout(ht,500) //调用ht() 方法

}

function ht() { //创建独立方法 ht()

var endtime = new Date(2016,6,29)

var todaytime = new Date();

var lefttime = Math.ceil((endtime - todaytime)/(1000 * 60 * 60 * 24))

document.getElementById("hdate").innerHTML = lefttime;

}

</script>

</body>

</html>

0 回复有任何疑惑可以回复我~

收起回答

0/150

提交

取消

倒计时效果

参与学习 55626 人
解答问题 242 个

电商网站限时抢购倒计时效果计算思路和方法，前端开发必备技术

进入课程

为什么我把2个例子写在1个html文档里就不行了

我要回答关注问题

热搜

最近搜索清空

为什么我把2个例子写在1个html文档里就不行了

3 回答

为什么我把2个例子写在1个html文档里就不行了