首页 > Web开发 > 详细

js 时间控件 日期多选

时间:2021-01-30 21:15:21      阅读:26      评论:0      收藏:0      [点我收藏+]

在开发的过程中,时间总是不可避免要出现的需求,这里给大家分享我比较常用的js 时间控件和一个问题的解决方法

layDate

官方文档地址:https://www.layui.com/laydate/

图片:

技术分享图片

 

 案例代码:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>使用 layDate 独立版</title>
</head>
<body>
<input type="text" id="test1">
<script src="/laydate/laydate.js"></script> <!-- 改成你的路径 -->
<script>
//执行一个laydate实例
laydate.render({
  elem: ‘#test1‘ //指定元素
});
</script>
</body>
</html>

几乎所有常用的需要都可以在这里找到,但是有一个问题,日期多选怎么实现,这里给大家分享下我解决的方法

图片:

技术分享图片

调用代码如下:

    <input type="text" id="calendar" value="2015-04-15"/>
    <script src="../src/jquery-1.9.1.min.js"></script>
    <script src="../src/calendar.js"></script>
    <script>
        $(".calendar4").Calendar({time:true});//时间选择
        var calendar = new Calendar();
        calendar.init({
            target: $(‘#calendar‘),
            range: [‘2015-3-5‘, ‘2015-3-25‘],
            multiple: true,
            maxdays: 5,
            overdays: function(a) {
                alert(‘添加已达上限 ‘ + a + ‘ 天‘);
            },
            filter:function(time){
                var date = new Date(time);
                // console.log(date.getDay())
                if(date.getDay()==0||date.getDay()==6){
                    return false;
                }
                return true;
            }
        });
    </script>  

这里提供dome的下载地址,如果有需要,可以点击下载。

https://download.csdn.net/download/qq_40716795/14963845

 

js 时间控件 日期多选

原文:https://www.cnblogs.com/smileZAZ/p/14349719.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!