H5-农阳历日期互转并对应

湘潇源

于 2019-01-14 15:48:49 发布

阅读量1.1k

点赞数 3

分类专栏： H5 文章标签：日期选择器农历阳历切换农历阳历对应

本文链接：https://blog.csdn.net/qq_37149397/article/details/86478600

版权

本文介绍了如何在H5中实现农历和阳历日期的选择器，并在选中日期时能够获取其对应的农历或阳历日期。通过监听iosselect.js插件的scrollEnd事件，设置全局变量来实现日期的切换。提供了代码示例的下载链接以及参考资源。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

文章主要实现农历、阳历日期选择器 &选中日期同时获取它对应的农/阳历日期&农历、阳历对应日期切换

公历日期切换到农历日期

点击图片后的效果在这里插入图片描述
在代码中主要引用了iosselect.js插件，主要思路是监听iosselect.js插件中的scrollEnd事件，拿到选中元素，设置全局变量，从而实现农历和阳历切换。主要实现代码如下：

<script type="text/javascript">
			var showDateDom = $('.showDate');
			var selectDateDom = $('.selectDate');
			var calendarConverter = new Calendar();
			
			// 初始化时间
			showDateDom.attr('data-year', 1985);
			showDateDom.attr('data-month', 7);
			showDateDom.attr('data-date', 1);
			showDateDom.attr('data-time', "时间未知");
			
			//年、月、日、生辰
			var yearData = function(callback) {
				callback(selectDateType == 1 ? calendarConverter.initNormalCalendar() : calendarConverter.initLunarCalendar());
			}
			var monthData = function(year, callback) {
				callback(se