知识 分享 互助 懒人建站

    懒人建站专注于网页素材下载,提供网站模板、网页设计、ps素材、图片素材等,服务于【个人站长】【网页设计师】和【web开发从业者】的代码素材与设计素材网站。

    懒人建站提供网页素材下载、网站模板
    知识 分享 互助!

    js日期选择控件layDate1.0兼容IE6+//6套皮肤

    作者:佳明妈 来源:jquery特效 2014-06-23 人气:
    js日期选择控件layDate1.0兼容IE6+、火狐、谷歌等浏览器,默认有6套皮肤、自定义皮肤也是非常方便快捷,layDate完全开源,实现了日期范围限制、开始日期设定、时分秒选择、智能响应、
    js日期选择控件layDate1.0兼容IE6+、火狐、谷歌等浏览器,默认有6套皮肤、自定义皮肤也是非常方便快捷,layDate完全开源,实现了日期范围限制、开始日期设定、时分秒选择、智能响应、自动纠错、节日识别,快捷键操作等功能。

    日期选择控件layDate基于原生javascript,这个日期控件有以下几大特点:

    1、兼容性好:有兼容了包括IE6在内的所有主流浏览器。日期选择控件layDate具备优雅的内部代码结构,良好的js性能体验,
    2、皮肤系统完备:默认有6套皮肤、自定义皮肤也是非常方便快捷,轻松愉快。
    3、layDate完全开源,你可以任意获取开发版源代码,一扫某些传统日期控件的封闭与狭隘。
    4、layDate日期选择控件简单与易用,延续了layui一贯的风格。
    5、遵循LGPL协议,您可以免费将她用于任何个人项目。

    这个js日期选择控件l能实现的功能如下:
    日期范围限制、开始日期设定、时分秒选择、智能响应、自动纠错、节日识别,快捷键操作等

    js代码调用实例:

    1、简单的调用
    tle="初步认识对应的说明">
    <input onclick="laydate()">
    这是是一个最简单的调用方式,它会把自身作为目标元素。除此之外,您还可以按照需求传入一些其它key,比如:
    <input onclick="laydate({istime: true format: 'YYYY-MM-DD hh:mm:ss'})">
    那么对于输入框,如果用户乱填怎么办?没关系,laydate会智能纠错,你可以尝试在上述表单输入任意值,然后点击页面其它处测试一下。当然,您其实还可以设定任何html元素作为目标对象,又比如:<div onclick="laydate()"></div>
    
    <input id="hello" class="laydate-icon">
    <script>
    laydate({
        elem: '#hello' //目标元素。由于laydate.js封装了一个轻量级的选择器引擎,因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'
        event: 'focus' //响应事件。如果没有传入event,则按照默认的click
        festival: true //显示节日
    });
    </script>
    
    自定义日期格式:
    <div id="test1" class="laydate-icon"></div>
    <script>
    laydate({
        elem: '#test1'
        format: 'YYYY年MM月DD日'
    });
    </script>
    
    日期范围限制:
    开始日:<li class="laydate-icon" id="start" style="width:200px; margin-right:10px;"></li>
    结束日:<li class="laydate-icon" id="end" style="width:200px;"></li>
    <script>
    //懒人建站
    var start = {
        elem: '#start'
        format: 'YYYY/MM/DD hh:mm:ss'
        min: laydate.now() //设定最小日期为当前日期
        max: '2099-06-16 23:59:59' //最大日期
        istime: true
        istoday: false
        choose: function(datas){
             end.min = datas; //开始日选好后,重置结束日的最小日期
             end.start = datas //将结束日的初始值设定为开始日
        }
    };
    var end = {
        elem: '#end'
        format: 'YYYY/MM/DD hh:mm:ss'
        min: laydate.now()
        max: '2099-06-16 23:59:59'
        istime: true
        istoday: false
        choose: function(datas){
            start.max = datas; //结束日选好后,充值开始日的最大日期
        }
    };
    laydate(start);
    laydate(end);
    </script>
    
    
    
    ↓ 查看全文

    js日期选择控件layDate1.0兼容IE6+//6套皮肤由懒人建站收集整理,您可以自由传播,请主动带上本文链接

    懒人建站就是免费分享,觉得有用就多来支持一下,没有能帮到您,懒人也只能表示遗憾,希望有一天能帮到您。

    js日期选择控件layDate1.0兼容IE6+//6套皮肤-最新评论