日期插件 pikaday.js 的使用

最新推荐文章于 2024-10-11 08:04:46 发布

weixin_30920853

最新推荐文章于 2024-10-11 08:04:46 发布

阅读量325

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/lansetuerqi/p/8989349.html

本文介绍如何使用Pikaday日期选择器实现一个简单的日期预约功能，包括引入必要的JS和CSS文件、设置HTML结构及JavaScript配置选项，如限定可选日期范围。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

--引入js/css
<link rel="stylesheet" type="text/css" href="https://www.js-css.cn/jscode/date/date4/css/pikaday.css"/>
<script type="text/javascript" src="https://www.js-css.cn/jscode/date/date4/js/pikaday.min.js"></script>
--页面标签使用
<div>
    <span>预约时间:</span>
    <input type="text" id="datepicker" value="请选择日期" name="bookDate">
</div>
--控件参数控制
<script type="text/javascript">
    var data =new Date()
    var picker = new Pikaday(
    {
        field: document.getElementById('datepicker'),
        firstDay: 1,
        minDate:data,//只能选择今天以及以后的时间
        yearRange: [2000,2020]
    });
</script>

转载于:https://www.cnblogs.com/lansetuerqi/p/8989349.html