js插件---bootstrap-datepicker.js是什么

一、总结

一句话总结：选择时间的插件

时间选择插件

1、datepicker如何默认选择当前天？

直接给datepicker对应的input设置value

可以直接给datepicker对应的input设置value，

或者js代码如下

1 //获取当前时间，格式YYYY-MM-DD 2 function getNowFormatDate() { 3     var date = new Date(); 4     var seperator1 = "-"; 5     var year = date.getFullYear(); 6     var month = date.getMonth() + 1; 7     var strDate = date.getDate(); 8     if (month >= 1 && month <= 9) { 9         month = "0" + month;10     }11     if (strDate >= 0 && strDate <= 9) {12         strDate = "0" + strDate;13     }14     var currentdate = year + seperator1 + month + seperator1 + strDate;15     return currentdate;16 }17 $('#datepicker').val(getNowFormatDate());

二、前端日期选取插件bootstrap-datepicker.js的使用

参考：前端日期选取插件bootstrap-datepicker.js的使用 - 默1451的博客 - CSDN博客

https://blog.csdn.net/qq_19688989/article/details/74839019

一、引入js和css文件

二、html

三、编写js配置代码

$.fn.datepicker.dates['cn'] = {   //切换为中文显示	days: ["周日", "周一", "周二", "周三", "周四", "周五", "周六", "周日"],			daysShort: ["日", "一", "二", "三", "四", "五", "六", "七"],			daysMin: ["日", "一", "二", "三", "四", "五", "六", "七"],			months: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],			monthsShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],			today: "今天",			clear: "清除"	};		 $('.selectData').datepicker({	autoclose: true, //自动关闭	beforeShowDay: $.noop,    //在显示日期之前调用的函数	calendarWeeks: false,     //是否显示今年是第几周	clearBtn: false,          //显示清除按钮	daysOfWeekDisabled: [],   //星期几不可选	endDate: Infinity,        //日历结束日期	forceParse: true,         //是否强制转换不符合格式的字符串	format: 'yyyy-mm-dd',     //日期格式	keyboardNavigation: true, //是否显示箭头导航	language: 'cn',           //语言	minViewMode: 0,	orientation: "auto",      //方向	rtl: false,	startDate: -Infinity,     //日历开始日期	startView: 0,             //开始显示	todayBtn: false,          //今天按钮	todayHighlight: false,    //今天高亮	weekStart: 0              //星期几是开始});

官方文档地址：http://bootstrap-datepicker.readthedocs.io/en/latest/options.html

三、bootstrap-datepicker 插件修改为默认中文

参考：bootstrap-datepicker 插件修改为默认中文 - cnhxz - 博客园

https://www.cnblogs.com/cnhxz/p/3888698.html

bootstrap-datepicker 是一个非常优秀的时间选择插件，默认是英文显示日期的，通过下面几个小修改让其支持默认中文

1、首先将 bootstrap-datepicker.js 另存为 utf-8 格式保存

2、增加 cn 语言选项

var dates = $.fn.datepicker.dates = {        en: {            days: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"],            daysShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],            daysMin: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"],            months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],            monthsShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],            today: "Today",            clear: "Clear"        },        cn: {            days: ["周日", "周一", "周二", "周三", "周四", "周五", "周六", "周日"],            daysShort: ["日", "一", "二", "三", "四", "五", "六", "七"],            daysMin: ["日", "一", "二", "三", "四", "五", "六", "七"],            months: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],            monthsShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],            today: "今天",            clear: "清除"        }    };

红色部分为增加的语言选项

3、修改默认参数，默认语言为 cn

var defaults = $.fn.datepicker.defaults = {        autoclose: false,        beforeShowDay: $.noop,        calendarWeeks: false,        clearBtn: false,        daysOfWeekDisabled: [],        endDate: Infinity,        forceParse: true,        format: 'mm/dd/yyyy',        keyboardNavigation: true,        language: 'cn',        minViewMode: 0,        orientation: "auto",        rtl: false,        startDate: -Infinity,        startView: 0,        todayBtn: false,        todayHighlight: false,        weekStart: 0    };

红色部分为修改的默认语言

至此完成默认中文的修改，效果如下图：