laydate动态设置Mark&Min&Max

最新推荐文章于 2023-05-12 15:14:41 发布

jojoy_828

最新推荐文章于 2023-05-12 15:14:41 发布

阅读量4k

点赞数

分类专栏：开源组件文章标签： laydate mark max min 设置Mark

本文链接：https://blog.csdn.net/jojoy_828/article/details/86489601

版权

开源组件专栏收录该内容

13 篇文章 0 订阅

订阅专栏

laydate动态设置自定义重要日子，以及动态设备最小与最大可选日期

版本：laydate5.0.2 独立版，layui组件版仅引入laydata.js方式有所区别，具体可参考https://www.layui.com/doc/

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>动态设置layDate参数</title>
</head>
<body>

<input type="text" id="test1">

<button id="test2" >set mark</button>
<button id="test3" >change mark</button>
<button id="test4" >clear mark</button>
<button id="test5" >set min&max</button>
 
<script src="./laydate5.0.2/laydate.js"></script>
<script src="./jquery-2.1.1.min.js"></script>
<script>

var myLaydate;
var mark = {};

$(function () {		
	//执行一个laydate实例
	myLaydate = laydate.render({
	  elem: '#test1' //指定元素
	  ,type: 'datetime'
	  ,mark: mark
	});
	
	$("#test2").on("click",function(){
	   //searchMarkData();
	   mark = {
		'2019-01-14': '例会'
	   };
	   myLaydate.config.mark = mark;
	});
	
	$("#test3").on("click",function(){
	   //searchMarkData();
	   mark = {
		'2019-01-18': '年会',
		'2019-01-19': '',
		'2019-01-20': ''
	   };
	   myLaydate.config.mark = mark;
	});
	
	$("#test4").on("click",function(){
	   myLaydate.config.mark = {};
	});
	
	$("#test5").on("click",function(){
	   myLaydate.config.min ={
		year:2019, 
		month:1,//月份起始为0，即这里指的是2月
		date: 5, 
		hours: 0, 
		minutes: 0, 
		seconds : 0
	   }
	   
	   myLaydate.config.max ={
		year:2019, 
		month:1,//月份起始为0 
		date: 25, 
		hours: 0, 
		minutes: 0, 
		seconds : 0
	   }
	});

	
});

//根据具体条件去后台请求数据
function searchMarkData() {
	var deviceId = $("#deviceId").val();
	if (!deviceId || deviceId == "") {
		layer.msg("请选择设备");
		return;
	}

	$.ajax({
		type: 'post',
		url: '${ctx}/getMarkData',
		data: {
			"deviceId": deviceId
		},
		dataType: 'json',
		success: function (data) {
			var mark = {};
			//组装mark数组
			if (data != null && data.length > 0) {
				for(var i=0;i<data.length;i++){
					mark[data[i]]='';
				}
			}
		    myLaydate.config.mark = mark;		 
		}
	});
}

</script>
</body>
</html>

jojoy_828

关注

0
点赞
踩
7

收藏

觉得还不错? 一键收藏
0
评论
laydate动态设置Mark&Min&Max

laydate动态设置自定义重要日子，以及动态设备最小与最大可选日期版本：laydate5.0.2 独立版，layui组件版仅引入laydata.js方式有所区别，具体可参考https://www.layui.com/doc/&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="utf-8"&gt; &...
复制链接

扫一扫

专栏目录