À quoi sert bootstrap-datepicker

Dans bootstrap, "bootstrap-datepicker" est utilisé pour définir les styles de calendrier et d'heure. Il s'agit d'un plug-in de sélection d'heure. La syntaxe est "element object.datepicker({property:property value,...})" ; différentes propriétés peuvent lui être transmises pour définir le style d'affichage de l'heure.

L'environnement d'exploitation de ce tutoriel : système Windows 10, bootstrap version 3.3.7, ordinateur DELL G3

À quoi sert bootstrap-datepicker

bootstrap-datepicker est un plug-in de sélection d'heure, mais le format de texte affiché par défaut est l'anglais, nous devons donc d'abord introduire le package chinois

<script type="text/javascript" src="bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>
<script type="text/javascript" src=&#39;bootstrap-datetimepicker-master/js/locales/bootstrap-datetimepicker.zh-CN.js&#39;></script>
<script>

Une brève introduction à quelques propriétés de base de bootstrap-datepicker

$(function(){
         $('#datetimepicker').datetimepicker({
           language:"zh-CN",    //语言选择中文
           format:"yyyy-mm",    //格式化日期
           timepicker:true,     //关闭时间选项
           yearEnd:2050,        //设置最大年份
           todayButton:false    //关闭选择今天按钮
           autoclose: 1,        //选择完日期后，弹出框自动关闭
           startView:3,         //打开弹出框时，显示到什么格式,3代表月
           minView: 3,          //能选择到的最小日期格式
    });

Donnez 2 cas simples

Afficher uniquement l'année et le mois

$('#datetimepicker').datetimepicker({
         language:"zh-CN",
         format:'yyyy-mm',
         autoclose: 1,
         startView:3, 
         minView: 3,
       });

Afficher l'année, le mois et le jour

            language:  'zh-CN',  
            minView:2,
            autoclose: 1,
            startView:3, 
            format:'yyyy-mm-dd',

Remarque : il peut y avoir un problème avec le style de sélection du calendrier

Il n'y a pas d'images de boutons sur les côtés gauche et droit

Cela devrait Il s'agit d'un problème de version bootstrap. Il sera affiché sur la version 2, mais pas sur la version 3. Pour le moment, l'ajout du nom de la classe de contrôle de formulaire à l'entrée peut résoudre le problème. weekStart

Integer. Valeur par défaut : 0

Le jour où la semaine commence. 0 (dimanche) à 6 (samedi)

startDate

Date Valeur par défaut : heure de début

endDate

Date Valeur par défaut : heure de fin

autoclose

Booléen.

S'il faut fermer le sélecteur de date et d'heure immédiatement après avoir sélectionné une date.

startView

Number, String Valeur par défaut : 2, 'month'

La vue qui s'affiche pour la première fois après l'ouverture du sélecteur de date et d'heure. Valeurs acceptables :

0 ou 'hour' pour une vue horaire

1 ou 'day' pour une vue journalière

• 2 ou 'month' pour une vue mensuelle (par défaut)

• 3 ou 'année ' est la vue de l'année

• 4 ou 'décennie' est la vue de la décennie
todayBtn

• Booléen, "lié" Valeur par défaut : faux

Si cette valeur est vraie ou "liée", a Le bouton « Aujourd'hui » est affiché en bas du composant de sélection de date et d'heure pour sélectionner la date actuelle. Si c'est vrai, le bouton "Aujourd'hui" bascule uniquement vers la date du jour. S'il est "lié", la date du jour sera sélectionnée.

todayHighlight

Boolean Valeur par défaut : false

Si vrai, mettez en surbrillance la date actuelle.

Recommandations associées : Tutoriel bootstrap

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!