Heim  >  Artikel  >  Web-Frontend  >  So implementieren Sie mit Bootstrap einen Zeitselektor für Jahr, Monat und Tag

So implementieren Sie mit Bootstrap einen Zeitselektor für Jahr, Monat und Tag

爱喝马黛茶的安东尼
爱喝马黛茶的安东尼Original
2019-07-17 13:05:587143Durchsuche

So implementieren Sie mit Bootstrap einen Zeitselektor für Jahr, Monat und Tag

Verwenden Sie Bootstrap, um die Zeitauswahl zu implementieren:

1. CSS-Dateien: bootstrap.min.css, bootstrap-datetimepicker.min .css

2. JS-Dateien: jquery-1.8.3.min.js, bootstrap.min.js, bootstrap-datetimepicker.js, bootstrap-datetimepicker.zh-CN.js

So implementieren Sie mit Bootstrap einen Zeitselektor für Jahr, Monat und Tag

Verwenden Sie Bootstrap, um die Jahresauswahl zu implementieren

Der Bootstrap-Konfigurationscode lautet wie folgt:

<script type="text/javascript">
$(&#39;.form_datetime&#39;).datetimepicker({
    language:  &#39;zh-CN&#39;,
    minView: 4,         format: &#39;yyyy&#39;,
    startDate:2019,
    autoclose: 1,
    startView: 4,
});
</script>

Der erzielte Effekt ist wie folgt:

So implementieren Sie mit Bootstrap einen Zeitselektor für Jahr, Monat und Tag

Verwenden Sie Bootstrap, um die Monatsauswahl zu implementieren

Der Bootstrap-Konfigurationscode lautet wie folgt:

<script type="text/javascript">
$(&#39;.form_datetime&#39;).datetimepicker({
    format: &#39;mm&#39;,
    autoclose:true,
    startView:3,
    minView:3,
    maxView:3,
    initialDate:new Date(),
    language:&#39;zh-CN&#39;
});
</script>

Der erzielte Effekt lautet wie folgt:

So implementieren Sie mit Bootstrap einen Zeitselektor für Jahr, Monat und Tag

Verwandte Empfehlungen: „Bootstrap Erste Schritte Tutorial

Verwenden Sie Bootstrap, um das Jahr auszuwählen und Monat

Der Bootstrap-Konfigurationscode lautet wie folgt:

<script type="text/javascript">
$(&#39;.form_datetime&#39;).datetimepicker({
    format: &#39;mm&#39;,
    autoclose:true,
    startView:3,
    minView:3,
    maxView:3,
    initialDate:new Date(),
    language:&#39;zh-CN&#39;
});
</script>

Der erzielte Effekt ist wie folgt:

So implementieren Sie mit Bootstrap einen Zeitselektor für Jahr, Monat und Tag

Verwenden Sie Bootstrap, um Jahr, Monat und Tag auszuwählen

Der Bootstrap-Konfigurationscode lautet wie folgt:

<script type="text/javascript">
$(&#39;.form_datetime&#39;).datetimepicker({
     format: &#39;yyyymmdd&#39;,
     weekStart: 1,
     autoclose: true,
     startView: 2,
     minView: 2,
    language:&#39;zh-CN&#39;
});
</script>

Der erzielte Effekt ist wie folgt:

So implementieren Sie mit Bootstrap einen Zeitselektor für Jahr, Monat und Tag

Verwenden Sie Bootstrap, um die Auswahl von Jahr, Monat, Tag, Stunde, Minute und Sekunde zu realisieren

Der Bootstrap-Konfigurationscode lautet wie folgt:

<script type="text/javascript">
$(&#39;.form_datetime&#39;).datetimepicker({
         language : &#39;zh-CN&#39;,
         format : &#39;yyyy-mm-dd hh:ii:ss&#39;,
         weekStart: 1,
         todayBtn:  1,
         autoclose: 1,
         todayHighlight: 1,
         startView: 2,
         forceParse: 0,
         showMeridian: 1
});
</script>

Der erzielte Effekt ist wie folgt:

So implementieren Sie mit Bootstrap einen Zeitselektor für Jahr, Monat und Tag

Verwenden Sie Bootstrap, um die Stundenauswahl zu implementieren

Der Bootstrap-Konfigurationscode lautet wie folgt:

<script type="text/javascript">
$(&#39;.form_datetime&#39;).datetimepicker({
        language : &#39;zh-CN&#39;,
        weekStart: 1,
        todayBtn:  1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 1,
        minView: 0,
        maxView: 1,
        forceParse: 0
});
</script>

Der erzielte Effekt ist wie folgt:

So implementieren Sie mit Bootstrap einen Zeitselektor für Jahr, Monat und Tag

Das obige ist der detaillierte Inhalt vonSo implementieren Sie mit Bootstrap einen Zeitselektor für Jahr, Monat und Tag. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn