PC端比较好用的日期选择器

今天在做东西的时候需要用到日期选择器,就去网上查阅了一些资料,发现了两个比较好用的日期选择器就整理了下来。

1、bootstrap-datepicker

 <link rel="stylesheet" href="./plugs/bootstrap/css/bootstrap.min.css">
 <link rel="stylesheet" href="./plugs/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css">

<input class="date" type="text">

<script src="plugs/jquery/dist/jquery.min.js"></script>
<script src="plugs/bootstrap/js/bootstrap.min.js"></script>
<script src="plugs/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
<script>
    $(function () {
        $('.date').datepicker({
            autoclose: true,//选中之后自动隐藏日期选择框
            format: "yyyy-mm-dd"//日期格式
        });
        $(".date").datepicker("setDate", nowDate());//设置默认时间
    });

    //  获取系统当前时间
    function nowDate() {
        var myDate = new Date();
        //获取当前年
        var year = myDate.getFullYear();
        //获取当前月
        var month = myDate.getMonth() + 1;
        //获取当前日
        var date = myDate.getDate();
        return year + '-' + month + '-' + date;
    }
</script>

2、layDate

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

<script src="plugs/laydate/laydate.js"></script>
<script>
    laydate.render({
        elem: '#date',  //  指定元素
        lang: 'en',     //  指定语言
        value: nowDate(),   //  默认时间
        theme: '#393D49'    //  主题
    });

    //  获取系统当前时间
    function nowDate() {
        var myDate = new Date();
        //获取当前年
        var year = myDate.getFullYear();
        //获取当前月
        var month = myDate.getMonth() + 1;
        //获取当前日
        var date = myDate.getDate();
        return year + '-' + month + '-' + date;
    }
</script>
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • layDaye.js API 一、核心方法:laydate(options); options是一个对象,它包含了...
    Mx勇阅读 4,176评论 0 2
  • 直接上图: 需要完成的需求是这个页面的实现:点击“1”跳转到“2”,在页面“2”中可以在“3”中选择你的家乡,在“...
    淮左明都阅读 18,693评论 0 2
  • 社会对财富的毒性作用 人行道的诱惑来自社会的有毒财富腐败。社会大众已经为你定义了财富:“财富”是由私人司机驾驶的劳...
    EZH阅读 1,251评论 0 6
  • 结束了高中生活,我们即将踏入大学校园, 在进入大学生活前,最重要的还是要明白自己要做的是什么,想要达到怎么样的目...
    挽逢阅读 171评论 0 0
  • 霜月未央,此去未经年,然终日念之。良辰好景早已虚设。积云未遂,只得片面爱人身影。绝情杨柳,勿绝我痴心,挥赶不去,音...
    四喜壬阅读 260评论 0 0

友情链接更多精彩内容