`

项目实战——日历翻页获取数据render

 
阅读更多
var reg = /(([\,,,]*\d{4}-\d{2}-(\/*\d{2})+)+)\s*([\(|(]\S+[\)|)])*\s*((\/*\d{2}[:,:]\d{2})+)\s*([\(|(]\S+[\)|)])*/;
 function getData(date,channelId){
	 renderCalendar();
 	 $.post(
 		'/info/calendar/list/json', 
 		{
 			'date':date,
 			'channelId':channelId
 		},
 		function(data){
 			if(data.code === 0 && data.hasOwnProperty('infos')){
 				orgData(data.infos,date);
 			}
 		},'json'
 	);
  };
function orgData(dataList,date){
	var list = [];
	for(var i=0;i<dataList.length;i++){
		var time = dataList[i].infoParamMap.ycsj.value;
		var regList = reg.exec(time);
		var regDate = regList[1].split(",");
		var regTime = regList[5].split("/");
		for(var j=0;j<regDate.length;j++){
			if(regDate[j].indexOf(date)>=0){
				var dateList =regDate[j].substring(regDate[j].lastIndexOf('-')+1,regDate[j].length).split("/");
				var foreDate = regDate[j].substring(0,regDate[j].lastIndexOf('-')+1);
			    for(var k=0;k<dateList.length;k++){
		    		var lastDate =  foreDate + dateList[k];
		    		for(var s =0;s<regTime.length;s++){
				    	list.push({
					    	'title':dataList[i].title,
					    	'date':lastDate,
					    	'time':regTime[s],
					    	'position':dataList[i].infoParamMap.dz.value,
					    	'id':dataList[i].id
				    	});
		    	 	}
			     }				
			 }
		 }
	 }
	 list.sort(_upSort);
	 renderCalendarData(list);
};
 _upSort = function(a, b){//升序排序
 	if (a["date"] < b["date"]){
 		return -1;
 	}else if (a["date"] == b["date"]){
 		if (a["time"]<b["time"]){
 			return -1;
 		}else if (a["time"] == b["time"]){
 			return 0;
 		}else{
 			return 1;
 		}
 	}else{
 		return 1;
 	}
 };
function renderCalendar(){
	var dayObj = getDaysInMonth(parseInt($("#year").text()),parseInt($("#day").text()));
	var dateStr = '';
	var count = 1;
	$("#calHead").nextAll().remove();
	for(var i=0;i<dayObj.line;i++){
		dateStr +="<tr>";
		for(var j=0;j<7;j++){
			count++;
			if(count-dayObj.firstDay <= 0||count-dayObj.firstDay > dayObj.days){
				dateStr +="<td valign='top'><h3></h3></td>";
			}else{
				dateStr +="<td valign='top'><h3>"+(count-dayObj.firstDay)+"</h3><div class='"+$("#year").text()+'-'+$("#day").text()+'-'+Int2Str(count-dayObj.firstDay)+"'></div></td>";
			}
		}
		dateStr +="</tr>";
	}
	$(dateStr).insertAfter("#calHead"); 	
	$("#calendarTable").find("td:nth-child(6),td:nth-child(7)").addClass("bgcolor");
}
function renderCalendarData(list){
	for(var k=0;k<list.length;k++){
		var dzClass = list[k].position=="新清华学堂"?"qingHuaXueTang":list[k].position=="蒙民伟音乐厅"?"yinYueTing":list[k].position=="大礼堂"?"daLiTang":list[k].position=="蒙民伟楼学生活动中心"?"huoDongZHongXin":list[k].position=="新学堂实验剧场"?"shiYanJuCHang":"";
		$("."+list[k].date).append("<a class='"+dzClass+"' href='$base/info/pwzx_hdap/"+list[k].id+"'>"+list[k].title+"</a><span>"+list[k].time+"</span>");
	}
}
 function getDaysInMonth(year,month){
 	month = parseInt(month,10);  //parseInt(number,type)这个函数后面如果不跟第2个参数来表示进制的话,默认是10进制。
 	var temp = new Date(year,month,0);
 	var firstDay = (temp.getDay()-temp.getDate()+1)%7+7;
 	var line = Math.ceil((firstDay+temp.getDate()-1)/7);
	return {'days':temp.getDate(),'firstDay':firstDay,'line':line}; 
 }
function Int2Str(number){
	return (parseInt(number).toString().length==1?'0':'')+number;
};

function preMonth(){//上个月
	var curMonth = parseInt($("#day").text());
	var curYear = parseInt($("#year").text());
	if(curMonth==1){
		$("#day").text(12);
		$("#year").text(curYear-1);
	}else{
		$("#day").text(Int2Str(curMonth-1));
	}
	getData($("#year").text()+'-'+$("#day").text(),'153,154,155,156,159');
};
function nextMonth(){//下个月
	var curMonth = parseInt($("#day").text());
	var curYear = parseInt($("#year").text());
	if(curMonth==12){
		$("#day").text('01');
		$("#year").text(curYear+1);
	}else{
		$("#day").text(Int2Str(curMonth+1));
	}
	getData($("#year").text()+'-'+$("#day").text(),'153,154,155,156,159');
};
$(function(){
	var date = new Date();
 	$("#year").text(date.getFullYear());
 	$("#day").text(Int2Str(parseInt(date.getMonth())+1));
 	getData($("#year").text()+'-'+$("#day").text(),'153,154,155,156,159');
});

 

分享到:
评论

相关推荐

    Redux入门实战——todo-list2.0实现.7z

    在本文中,我们将深入探讨如何使用Redux来构建一个todo-list2.0应用,这是一个常见的前端实战项目,旨在帮助开发者理解Redux的核心思想以及React与Redux的集成。Redux是JavaScript应用程序的状态管理库,尤其在React...

    财报数据可视化 —— pandas数据分析,pyecharts可视化

    "财报数据可视化 —— pandas数据分析,pyecharts可视化"的主题聚焦于使用Python中的pandas库进行数据预处理和分析,以及利用pyecharts库进行数据可视化。这两个强大的工具结合,能够帮助我们高效地理解并展示财务...

    layui使用表格渲染获取行数据的例子

    需求:使用前端框架layui生成表格,点击表格中一行数据中的按钮,获取到这行数据。 解决办法: 在render中增加字段: done: function (res, curr, count) { // $('.x-body').find('.layui-table-body').find(table...

    RF_URP/RenderFeature_

    在Unity引擎中,Universal Render Pipeline (URP) 是一套高度可定制的渲染系统,它允许开发者根据项目需求调整和优化渲染流程。RF_URP/RenderFeature_ 的标题表明我们关注的是与URP中的RenderFeature相关的C#源代码...

    vtk实战(一)——HelloVtk

    在本篇“vtk实战(一)——HelloVtk”中,我们将探讨VTK(Visualization Toolkit)的基本使用,以及如何编写第一个VTK程序。VTK是一个开源的、跨平台的库,用于三维计算机图形学、图像处理和可视化。它提供了一系列...

    前端项目-jsrender.zip

    JSRender的主要特点是其简洁的语法和强大的数据绑定能力,使其成为在浏览器或Node.js环境中进行数据渲染的理想选择。 **1. 与Express 4、HAPI和browserify的集成** JSRender与流行的Web框架如Express 4和HAPI有着...

    JsRender.zip(jsrender.js和jsrender.min.js合集)

    **JsRender 概述** JsRender 是一个轻量级但功能强大的JavaScript模板引擎,由Microsoft的前员工 Boris Moore开发。...对于任何需要处理大量数据或构建复杂界面的项目,JsRender 都是一个值得考虑的工具。

    Flask学习项目之一——留言板.zip

    【标题】"Flask学习项目之一——留言板"是一个基于Python的Web开发框架Flask的应用示例,它展示了如何创建一个简单的在线留言板系统。这个项目旨在帮助初学者理解Flask的基本用法,包括路由定义、模板渲染、表单处理...

    ajax动态获取数据渲染的charts图表

    在本项目中,Ajax被用来模拟从后台获取数据。通常,这个过程包括以下步骤: 1. 创建XMLHttpRequest对象或使用jQuery等库提供的简化API。 2. 打开一个连接到服务器的新请求,并设置HTTP方法(如GET或POST)、请求URL...

    一个jQuery插件用于数据绑定的HTMLRender模板引擎

    HTMLRender是一款基于jQuery的数据绑定模板引擎,主要用于帮助开发者在JavaScript中高效地进行DOM操作和数据渲染。这款插件是jQuery的一个扩展,它提供了一种简洁的语法来将数据与HTML结构进行绑定,使得动态生成和...

    Layui数据表格之获取表格中所有的数据方法

    如果数据量很大,需要翻页获取数据,则需要在每次请求数据时累加这个count值,直至获取到所有数据为止。 总结一下,Layui数据表格提供了非常方便的API来获取表格中的所有数据,无论是直接赋值方式还是异步请求方式...

    基于vue3+koa2+qiankun2的微前端后台管理系统项目实战.zip

    基于vue3+koa2+qiankun2的微前端后台管理系统项目实战.zip 主应用基座构建 主应用需要用到elementui,暂时使用vue2.0+qiankun2.0版本。vue3.0beta体验在下面【子应用构建】章节 主应用项目主要在5个文件:utils...

    Laravel开发-laravel-pagerender

    首先,我们要理解laravel-pagerender的核心概念——父子关系。在网页设计中,页面常常存在层次结构,比如导航菜单、侧边栏和多级分类等。这些结构中的元素有上下级关系,laravel-pagerender正是用来处理这种关系的。...

    jquery-jsrender.js

    JSRender 提供了一套易于学习和使用的模板语法,允许开发者将数据和逻辑与视图模板分离,从而实现数据驱动的开发模式。 **主要特点:** 1. **简洁的语法**:JSRender 使用类似于 Handlebars 或 Mustache 的双大...

    用于接收网络数据的Render Filter

    【标题】:“用于接收网络数据的Render Filter” 在多媒体处理领域,Render Filter是一种关键组件,主要负责接收并呈现从网络中传输的数据。这里的“Render Filter”是专为接收网络数据而设计的,它允许系统从远程...

    vue props传入render函数,实现动态组件嵌套

    在Vue.js框架中,`props`是父组件向子组件传递数据的一种机制,而`render`函数则是Vue中用于自定义渲染逻辑的关键工具。本文将深入探讨如何利用`props`和`render`函数来实现组件之间的动态嵌套,从而提高应用的灵活...

    JsRender 的使用demo

    4. **绑定数据**: 获取要渲染的数据。 5. **渲染模板**: 调用编译后的模板函数,传入数据,将结果插入到DOM中。 **总结** JsRender 是一个强大且灵活的JavaScript模板引擎,它的出现简化了客户端的数据绑定和视图...

    jsrender.js

    JSRender的核心理念是使模板编写变得简单,易于理解和维护,同时提供丰富的功能,如数据绑定、条件语句、循环结构和自定义标签。 **1. JSRender的基本语法** JSRender的模板语法以`{{`和`}}`作为标记,用于包裹...

Global site tag (gtag.js) - Google Analytics