文章根据时间段显示的微信名和微信号

 

 

1.文章显示的微信名和微信号

 

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title>根据不同时间段显示不同的微信名和微信号</title>
	<link rel="stylesheet" href="../css/test2.css" />
</head>

<body>
<h1><span class="nm"></span>微信号：<span class="wx"></span></h1>
<h1><span class="nm"></span>微信号：<span class="wx"></span></h1>
<span class="nm"></span>
<span class="nm"></span>
<span class="nm"></span>
<span class="wx"></span>
<span class="wx"></span>
</body>
<script type="text/javascript" src="../js/jquery-2.0.2.min.js"></script>
<script type="text/javascript" src="../js/time_weixin.js" ></script>
</html>

 

　　2.time_weixin.js代码

function time_weixin(){
	var info= new Array();
	$.ajax({
		url:"../js/chuli.php",
		data:{id:1},
		type:"POST",
        dataType:"TEXT",
        async:false,
        success: function(data){
		    var tm=new Date();
			var hours=tm.getHours();
			var name="";
			var weixin="";
			var hang=data.split("/");

			if(hours>=0 &&　hours<6){
				var lie=hang[0].split("|");
				name=lie[0];
				weixin=lie[1];
			}
			else if(hours>=6 &&　hours<9){
				var lie=hang[1].split("|");
				name=lie[0];
				weixin=lie[1];
			}
			else if(hours>=9 &&　hours<12){
				var lie=hang[2].split("|");
				name=lie[0];
				weixin=lie[1];
			}
			else if(hours>=12 &&　hours<13){
				var lie=hang[3].split("|");
				name=lie[0];
				weixin=lie[1];
			}
			else if(hours>=13 &&　hours<18){
				var lie=hang[4].split("|");
				name=lie[0];
				weixin=lie[1];
			}
			else if(hours>=18 &&　hours<20){
				var lie=hang[5].split("|");
				name=lie[0];
				weixin=lie[1];
			}
			else if(hours>=20 &&　hours<22){
				var lie=hang[6].split("|");
				name=lie[0];
				weixin=lie[1];
			}
			else{  //22时-24时
				var lie=hang[7].split("|");
				name=lie[0];
				weixin=lie[1];
			}
			info[0]=name;
			info[1]=weixin;

        }
	});
	return info;	
}
var nmtext=time_weixin()[0];
var wxtext=time_weixin()[1];
var nm=document.getElementsByClassName("nm");
var wx=document.getElementsByClassName("wx");
for(i=0;i<nm.length;i++){
	nm[i].innerHTML = nmtext;
}
for(i=0;i<wx.length;i++){
	wx[i].innerHTML = wxtext;
}

3.chuli.php代码

<?php
$id=$_POST["id"];
if($id==0){
	$str=$_POST["str"];
	$str=substr($str,0,strlen($str)-1);
	$re=file_put_contents('str.txt', $str);
	if($re){
		echo "1";
	}
	else{
		echo "0";
	}
}
else{
	$str=file_get_contents('str.txt');
	echo $str;
}

　　

4.admin.html操作微信名和微信号的前端页面

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>各时间段显示微信名与微信号</title>
</head>
<style type="text/css">
	#time{
		padding-bottom: 20px;
	}
</style>
<body>
	<h1>各时间段显示微信名与微信号</h1>
	<div id="xianshi">
	<div id="time" class="t0_6">
		<div>0--6时：</div>
		<div class="m0">
			      
			姓名：<input type="text" class="nm0" />
			微信号：<input type="text" class="wx0" />
		</div>
	</div>
	<div id="time" class="t6_9">
		<div>6--9时：</div>
		<div class="m1">
			      
			姓名：<input type="text" class="nm1" />
			微信号：<input type="text" class="wx1" />
		</div>
	</div>
	<div id="time" class="t9_12">
		<div>9--12时：</div>
		<div class="m2">
			      
			姓名：<input type="text" class="nm2" />
			微信号：<input type="text" class="wx2" />
		</div>
	</div>
	<div id="time" class="t12_13">
		<div>12--13时：</div>
		<div class="m3">
			      
			姓名：<input type="text" class="nm3" />
			微信号：<input type="text" class="wx3" />
		</div>
	</div>
	<div id="time" class="t13_18">
		<div>13--18时：</div>
		<div class="m4">
			      
			姓名：<input type="text" class="nm4" />
			微信号：<input type="text" class="wx4" />
		</div>
	</div>
	<div id="time" class="t18_20">
		<div>18--20时：</div>
		<div class="m5">
			      
			姓名：<input type="text" class="nm5" />
			微信号：<input type="text" class="wx5" />
		</div>
	</div>
	<div id="time" class="t20_22">
		<div>20--22时：</div>
		<div class="m6">
			      
			姓名：<input type="text" class="nm6" />
			微信号：<input type="text" class="wx6" />
		</div>
	</div>
	<div id="time" class="t22_24">
		<div>22--24时：</div>
		<div class="m7">
			      
			姓名：<input type="text" class="nm7" />
			微信号：<input type="text" class="wx7" />
		</div>
	</div>
	</div>
	<input type="submit" value="保存" onclick="wxsave()" />
</body>
<script type="text/javascript" src="jquery-2.0.2.min.js" ></script>
<script type="text/javascript" >
xianshi();
function xianshi(){
	$.ajax({
		url:"chuli.php",
		data:{id:1},
		type:"POST",
        dataType:"TEXT",
        success: function(data){
        	var hang=data.split("/");
     
		    for(var i=0;i<hang.length;i++)
		    {
		        var lie=hang[i].split("|");
		        //var str="       姓名：<input type='text' value='"+lie[0]+"' class='nm"+i+"' />微信号：<input type='text' value='"+lie[1]+"' class='wx"+i+"' />";
		        var m=".nm"+i;
		        var x=".wx"+i;
		        $(m).val(lie[0]);
		        $(x).val(lie[1]);
		    }
        }
	});
}

function wxsave(){
	var text="";
	for(var i=0;i<8;i++){
		var nmcl=".nm"+i;
		var wxcl=".wx"+i;
		var nm=$(nmcl).val();
		text=text+nm+"|";
		var wx=$(wxcl).val();
		text=text+wx+"/";
	}
	$.ajax({
		url:"chuli.php",
        data:{str:text,id:0},
        type:"POST",
        dataType:"TEXT",
        success: function(data){
        	if(data==1){
        		alert(":)  保存成功！！！");
        	}
        	else{
        		alert(":(  保存失败！！");
        	}
        }
	});
}
</script>
</html>

　　

5.储存数据的str.txt文本文件

张三|0--6/李四|6--9/王五|9--12/赵六|12--13/田七|13--18/朱八|18--20/肖九|20--22/孟十|22--24

　　

 

posted @ 2017-02-21 11:06  坏小子1993  阅读(490)  评论(0)    收藏  举报