关于时间的操作(JavaScript版)——依据不同区时显示对应的时间

        如今项目基本上告一段落了,难得有一定的闲暇,今天利用数小时完毕了一个功能模块——依据不同区时显示对应的时间,这方面网上基本没有现成的样例,如今将代码粘贴例如以下:       

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
	<head>
		<meta http-equiv="content-type" content="text/html; charset=GB2312" />
		<title>依据不同区时显示对应的时间</title>
		<script type="text/javascript">
			<!-- Begin
				function changeTZ() {
					var selectedValue = document.getElementById("TZ").value;
					var timeZone = selectedValue.split("*")[0];
					var city = selectedValue.split("*")[1];
					//console.log("所选城市:" + city + "、所选城市区时:" + timeZone);
					
					var date = new Date();
					var currentTimezone = -(date.getTimezoneOffset()/60);//当前区时
					var timeDifference = currentTimezone - timeZone;//时差
					console.log("当前区时:"+currentTimezone+"、时差:"+timeDifference);
					
					var year = 0;  //所选城市时间:年
					var month = 0; //所选城市时间:月
					var day = 0;   //所选城市时间:日
					var hour = 0;  //所选城市时间:小时
					var minute = 0;//所选城市时间:分钟
					var second = 0;//所选城市时间:秒
					
					var currentYear = date.getFullYear(); //当前时间:年
					var currentMonth = date.getMonth()+1; //当前时间:月
					var currentDay = date.getDate();      //当前时间:日
					var currentHour = date.getHours();    //当前时间:小时
					var currentMinute = date.getMinutes();//当前时间:分钟
					var currentSecond = date.getSeconds();//当前时间:秒
					
					second = currentSecond;
					
					if(timeDifference.toString().split(".").length == 2){//所选城市区时为小数
					    var intVlaue = parseInt(timeDifference.toString().split(".")[0]);//获取整数部分
						var floatVlaue = timeDifference - intVlaue;//获取小数部分
						hour = currentHour- intVlaue;
						minute = currentMinute - floatVlaue*60;
						if(minute>=60){
							hour = hour + 1;
							minute = minute - 60;
						}else if(minute < 0){
							hour = hour - 1;
							minute = 60 + minute;
						}
						//console.log("当前时间(小时):" + currentHour+"、所选城市时间(小时):"+hour);
					}else{
						hour = currentHour-timeDifference;				
						minute = currentMinute;
					}
					
					if(hour >= 24){
						day = currentDay + 1;
						hour = hour - 24;
					}else if(hour >= 0 && hour < 24){
						day = currentDay;
						hour = hour;
					}else if(hour < 0){
						day = currentDay - 1;
						hour = hour + 24;
					}
					
					if(currentMonth==1 || currentMonth==3 || currentMonth==5 || currentMonth==7 || currentMonth==8 || currentMonth==10 || currentMonth==12 ){//31天
						if(day > 31){
							if(currentMonth==12){
								year = currentYear + 1;
								month= 1;
								day = day - 31;
							}else{
								year = currentYear;
								month= currentMonth + 1;
								day = day - 31;
							}
						}else if(day == 0){
							if(currentMonth==1){
								year = currentYear - 1;
								month= 12;
								day = 31;
							}else{
								year = currentYear;
								month= currentMonth - 1;
								if(month==4 || month==6 || month==9 || month==11){
									day = 30;
								}else if(month==2){
									if((year % 400 == 0)||(year % 4 == 0)&&(year % 100 != 0)){//闰年
										day = 29;
									}else{//平年
										day = 28;
									}
								}
							}
						}else{
							year = currentYear;
							month= currentMonth;
							day = day;
						}
					}
					if(currentMonth==4 || currentMonth==6 || currentMonth==9 || currentMonth==11){//30天
						if(day > 30){
							year = currentYear;
							month= currentMonth + 1;
							day = day - 30;
						}else if(day == 0){						
							year = currentYear;
							month= currentMonth - 1;
							day = 31;
						}else{
							year = currentYear;
							month= currentMonth;
							day = day;
						}
					}
					if(currentMonth==2){//28天或29天
						year = currentYear;
						if((year % 400 == 0)||(year % 4 == 0)&&(year % 100 != 0)){//闰年
							if(day > 29){
								year = currentYear;
								month= currentMonth + 1;
								day = day - 29;
							}else if(day == 0){						
								year = currentYear;
								month= 1;
								day = 31;
							}else{
								year = currentYear;
								month= currentMonth;
								day = day;
							}
						}else{//平年
							if(day > 28){
								year = currentYear;
								month= currentMonth + 1;
								day = day - 28;
							}else if(day == 0){						
								year = currentYear;
								month= 1;
								day = 31;
							}else{
								year = currentYear;
								month= currentMonth;
								day = day;
							}
						}
					}

					hour = ((hour <= 9) ? ("0" + hour) : hour);  
					minute = ((minute <= 9) ? ("0" + minute) : minute);
					second = ((second <= 9) ? ("0" + second) : second);
					Clock.innerHTML = city + ":" + year +"年"+ month +"月"+ day +"日 " + hour + ":" + minute + ":" + second;
					setTimeout("changeTZ()", 1000);
				}
			//  End -->
		</script>
	</head>
	<body bgcolor="#ffffff" onLoad="javascript:changeTZ();">
		<div id="Clock"></div>
		<select style="font-size: 9pt;" onchange="changeTZ()" id="TZ">
			<option value="-12*国际换日线">GMT-12</option>
			<option value="-11*萨摩亚群岛">GMT-11</option>
			<option value="-10*夏威夷">GMT-10</option>
			<option value="-9*阿拉斯加">GMT-9</option>
			<option value="-8*太平洋时间">GMT-8</option>
			<option value="-7*美国山区">GMT-7</option>
			<option value="-6*墨西哥">GMT-6</option>
			<option value="-5*南美洲太平洋">GMT-5</option>
			<option value="-4.5*加拉加斯">GMT-4.5</option>
			<option value="-4*大西洋">GMT-4</option>
			<option value="-3.5*纽芬兰">GMT-3.5</option>
			<option value="-3*巴西利亚">GMT-3</option>
			<option value="-2*大西洋中部">GMT-2</option>
			<option value="-1*亚速尔">GMT-1</option>
			<option value="0*格林尼治">GMT</option>
			<option value="1*罗马">GMT +1</option>
			<option value="2*以色列">GMT +2</option>
			<option value="3*莫斯科">GMT +3</option>
			<option value="3.5*德黑兰">GMT+3.5</option>
			<option value="4*巴库">GMT +4</option>
			<option value="4.5*喀布尔">GMT+4.5</option>
			<option value="5*新德里">GMT +5</option>
			<option value="5.5*孟买">GMT+5.5</option>
			<option value="5.75*加德满都">GMT+5.75</option>
			<option value="6*达卡">GMT +6</option>
			<option value="6.5*仰光">GMT+6.5</option>
			<option value="7*曼谷">GMT +7</option>
			<option value="8*北京" selected>GMT +8</option>
			<option value="9*东京">GMT +9</option>
			<option value="9.5*达尔文">GMT+9.5</option>
			<option value="10*悉尼">GMT +10</option>
			<option value="11*马加丹">GMT +11</option>
			<option value="12*惠灵顿">GMT +12</option>
		</select>
	</body>
</html>

        【0分下载代码

posted @ 2014-06-27 12:03  mengfanrong  阅读(279)  评论(0编辑  收藏  举报