django中实现日期选择器(datepicker)

本文类似实现一个组件, 只需要在需要的模板文件中的引入文件, 即可对所有class为cxcalendar的input实现日期选择功能

1. 需要jquery库
2. 将四个文件路径设置为
   . /static/css/jquery.cxcalendar.css
   . /static/js/jquery.cxcalendar.min.js
   . /static/js/jquery.datetimepicker.full.js
   . /static/css/jquery.datetimepicker.css
3. 制作一个cxcalendar.html文件, 路径在/templates/根目录下即可
   代码内容为

<link rel="stylesheet" href="/static/css/jquery.cxcalendar.css" type="text/css" />
<script type="text/javascript" src="/static/js/jquery.cxcalendar.min.js"></script>
<script type="text/javascript" src="/static/js/jquery.datetimepicker.full.js"></script>
<link rel="stylesheet" href="/static/css/jquery.datetimepicker.css" type="text/css" />
<script>
$(function(){
    $('.cxcalendar').cxCalendar();
});
</script>

4. 在模板文件中, 只要引入{% include "cxcalendar.html" %}
   给需要增加日期选择的input框添加cxcalendar类即可

相关js文件下载 !!!下载!!!

效果如图

Paste_Image.png