首页 > 其他分享 >django-前端时间组件

django-前端时间组件

时间:2023-09-10 11:45:10浏览次数:37  
标签:datepicker 插件 Bootstrap min 前端 bootstrap js 组件 django

1、插件的下载
Bootstrap Datepicker是一款基 于Bootstrap框架的日期选择控件,可以方便地在Web应用中添加可交互的日期选择功能。Bootstrap Datepicker拥有丰富的选项和API,支持多种日期格式,可以自定义样式并支持各种语言。
Bootstrap Datepicker 依赖bootstrap:

  • bootstrap.min.css
  • jQuery.min.js
  • bootstrap.min.js

2. 插件引入

在这里找到对应的三个文件:

  • bootstrap-datepicker.css
  • bootstrap-datepicker.js
  • bootstrap-datepicker.zh-CN.min.js

3. 使用插件

要引入相应的插件, 使用日期插件要写一段js函数,指定id的名称。

 <link rel="stylesheet" href="static/plugins/bootstrap-3.4.1/css/bootstrap.min.css">
 <link rel="stylesheet" href="static/plugins/bootstrap-datepicker/css/bootstrap-datepicker.css">


 <script src="static/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
    <script src="static/plugins/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js"></script>
<script src="static/js/jquery-3.7.0.min.js"></script>
<script src="static/plugins/bootstrap-3.4.1/js/bootstrap.min.js"></script>
 <script>
        $(function () {
            $( "#id_create_time").datepicker({
                    autoclose: true,
                    format: 'yyyy-mm-dd',
                    startDate: 0,
                    language: "zh-CN"
                    });
        });

</script>

  

 

标签:datepicker,插件,Bootstrap,min,前端,bootstrap,js,组件,django
From: https://www.cnblogs.com/p4567/p/17690955.html

相关文章

  • 开课吧前端1期.阶段2:ES6详解-4 Promise generator-认识生成器函数 generator-yield
    10、PromisePromise--承诺异步:操作之间没啥关系,同时进行多个操作同步:同时只能做一件事优缺点异步:代码更复杂同步:代码简单 //比如我要请求4个数据,真正生产还要判断,没法看了,缩进//异步:特别麻烦ajax('/banners',function(banners)){ajax('/hotItem......
  • vue前端table列表右侧的滑动条怎样实现
    要在Vue前端table列表右侧添加滑动条,您可以使用CSSoverflow属性和::-webkit-scrollbar伪元素来实现。以下是示例代码:<template><divclass="table-container"><tableclass="table"><!--表头--><thead><tr>......
  • Android前端音视频数据接入GB28181平台意义
    技术背景在我们研发Android平台GB28181前端音视频接入模块之前,业内听到最多的是,如何用Android端在没有国标摄像头设备的前提下,模拟GB28181的信令和媒体流交互流程,实现GB28181整体方案的测试。Android端真的没有必要做个支持GB28181的接入模块?如果说做一个设备端摄像头国标设备接入......
  • vue子组件获取父组件数据
    1、使用this.$parent.event直接调用//父组件<template><div><child></child></div></template><script>importchildfrom'~/components/dam/child';exportdefault{components:{child},......
  • 文字组件表格中的文字纵向居中问题
    问题:文字组件中插入的表格,其中文本内容纵向如何设置居中解决:选取表格》表格工具》对齐方向》垂直居中 如果设置了垂直居中后文字仍是靠下,就需要考虑是否存在空段落, 以下设置可以显示编辑标记:开始》段落》显示/隐藏段落标记如果确实是空段落造成的,可以使用替换解决:选取表......
  • Django报错django.contrib.admin.sites.AlreadyRegistered
    Django报错django.contrib.admin.sites.AlreadyRegistered报错django.contrib.admin.sites.AlreadyRegistered:ThemodelOrderisalreadyregisteredwith'goods_service.OrderAdmin'.错误提示的意思是Order模型已经在goods_service.OrderAdmin中注册了,因此你不能再次......
  • 前端歌谣-第六课-关于this指向
    前言我是歌谣最好的种树是十年前其次是现在今天继续给大家带来的是this的讲解环境配置npminit-yyarnaddvite-D修改page.json配置端口{"name":"demo1","version":"1.0.0","description":"","main":"index.js",......
  • 一个由于前端缺少 encodeURIComponent 引起的登录问题的分析和解决
    笔者最近三年一直在SAP中国研究院担任Angular应用开发程序员的职位,负责的产品是SAP电商云SpartacusUI的开发。Spartacus是SAP公司主导的一个开源项目,Github项目地址:https://github.com/SAP/spartacus.电商云StorefrontUI界面如下,客户如果想在上面下单,需要点击Si......
  • Vue进阶(幺陆陆):组件实例 $el 详解
    this指向组件实例,$el用于获取Vue实例挂载的DOM元素,在mounted生命周期中才有效,之前的钩子函数内无效。如下代码所示,Vue脚手架中,$el指向当前组件template模板中的根标签。<template><divid="root">Lorem,ipsum</div></template><script>exportdefault......
  • 考试系统前端项目复盘
    前段时间和朋友做了一个局域网考试系统,总共有3个端:考生端、监考端、管理端。框架与相关的库先简单说明一下我使用的框架和相关的库:构建工具:Vite框架:Vue3UI组件库:element-plus网络请求库:axios路由跳转:vue-router状态管理:piniaCSS扩展语言:sass其它与项目......