laydate.js日期时间选择插件
更新时间：2017年01月04日 11:23:46 作者：东成熙就
这篇文章主要为大家详细介绍了laydate.js日期时间选择插件，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
日期时间选择插件laydate.js：
效果图：
1. 引入JS。 官网：http://laydate.layui.com
<script type="text/javascript" src="js/laydate.js"></script>
2. 根据需要做相应的配置。详情参看官网。
<script>
laydate({
elem: '#seldate', //目标元素。由于laydate.js封装了一个轻量级的选择器引擎，因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'
event: 'focus', //响应事件。如果没有传入event，则按照默认的click
format: 'YYYY/MM/DD hh:mm:ss', // 分隔符可以任意定义，该例子表示只显示年月
festival: true, //显示节日
istime: true, //显示时间选项
choose: function(datas){ //选择日期完毕的回调
alert('得到：'+datas);
}
});
</script>
实例源码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--
<link href="favicon.ico" rel="shortcut icon" type="image/x-icon" />
<link href="favicon.ico" rel="Bookmark" type="image/x-icon" />
-->
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>layDate日期时间选择插件</title>
<link href="" rel="stylesheet" />
<script type="text/javascript" src="js/laydate.js"></script>
</head>
<body>
<form method="post" action="">
Way1,
请选择日期:<input type="text" name="date" onclick="laydate()" />
<hr />
Way2,
<input type="text" name="date" id='seldate' class="laydate-icon" /><hr />
<script>
laydate({
elem: '#seldate', //目标元素。由于laydate.js封装了一个轻量级的选择器引擎，因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'
event: 'focus', //响应事件。如果没有传入event，则按照默认的click
format: 'YYYY/MM/DD hh:mm:ss', // 分隔符可以任意定义，该例子表示只显示年月
festival: true, //显示节日
istime: true, //显示时间选项
choose: function(datas){ //选择日期完毕的回调
alert('得到：'+datas);
}
});
</script>
Way3,
<input id="seldate1">
<span class="laydate-icon" onclick="laydate({elem:'#seldate1'});"></span>
</form>
</body>
</html>
Find more here：http://laydate.layui.com/
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
本篇文章主要介绍了javascript实现一个页面加载进度loading的具体步骤以及示例代码，具有一定的参考价值，下面跟着小编一起来看下吧2017-01-01
今天小编就为大家分享一篇关于JavaScript中的"=、==、==="区别讲解，小编觉得内容挺不错的，现在分享给大家，具有很好的参考价值，需要的朋友一起跟随小编来看看吧2019-01-01
这篇文章主要介绍了Javascript中的包装类型介绍,包装类型是指在执行代码的一瞬间把数据包装成引用类型,本文讲解的就是这个小知识,需要的朋友可以参考下2015-04-04
JS使用replace()方法和正则表达式进行字符串的搜索与替换实例
这篇文章主要介绍了JS使用replace()方法和正则表达式进行字符串的搜索与替换实例,需要的朋友可以参考下2014-04-04
微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码
本文通过实例代码给大家介绍了微信小程序使用scroll-view标签实现自动滑动到底部功能，代码简单易懂，非常不错，具有一定的参考借鉴价值，需要的朋友参考下吧2018-11-11
这篇文章主要为大家详细介绍了微信小程序实现简单搜索功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-07-07
这篇文章主要介绍了如何使用 JavaScript 操作浏览器历史记录 API，帮助大家更好的理解和使用JavaScript，感兴趣的朋友可以了解下2020-11-11
uniapp中每个页面可以理解为一个单页面组件,下面这篇文章主要给大家介绍了关于如何写一个uniapp通用页面组件的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2022-12-12
javascript 密码强度验证规则、打分、验证（给出前端代码，后端代码可根据强度规则翻译）
密码强度是一个很普遍的功能，比较简单，主要是怎么制定这个强度规则。2010-05-05
这篇文章主要介绍了js实现鼠标划过给div加透明度的方法,涉及javascript动态操作页面元素属性的相关技巧,该方法可兼容火狐与IE浏览器,需要的朋友可以参考下2015-05-05
最新评论