Home > Web Front-end > Bootstrap Tutorial > How to use bootstrap to select the time of year, month and day

How to use bootstrap to select the time of year, month and day

(*-*)浩
Release: 2019-07-18 09:24:54
Original
4402 people have browsed it

The following describes how to use bootstrap to select the time of year, month and day.

How to use bootstrap to select the time of year, month and day

Use bootstrap to implement time selection. The page needs to load the following files: (recommended learning: Bootstrap video tutorial)

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

2, JS file: jquery-1.8 .3.min.js, bootstrap.min.js, bootstrap-datetimepicker.js, bootstrap-datetimepicker.zh-CN.js

How to use bootstrap to select the time of year, month and dayUse bootstrap to implement year selection.

The bootstrap configuration code is as follows:

<script>
$(&#39;.form_datetime&#39;).datetimepicker({
    language:  &#39;zh-CN&#39;,
    minView: 4,         format: &#39;yyyy&#39;,
    startDate:2019,
    autoclose: 1,
    startView: 4,
});
</script>
Copy after login

Use bootstrap to select the month.

The bootstrap configuration code is as follows:

<script>
$(&#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>
Copy after login

Use bootstrap to select the year, month and day.

bootstrap configuration code is as follows:

<script>
$(&#39;.form_datetime&#39;).datetimepicker({
     format: &#39;yyyymmdd&#39;,
     weekStart: 1,
     autoclose: true,
     startView: 2,
     minView: 2,
    language:&#39;zh-CN&#39;
});
</script>
Copy after login

The effect achieved is as follows:

How to use bootstrap to select the time of year, month and day

##More Bootstrap For related technical articles, please visit the

Bootstrap Tutorial column to learn!

The above is the detailed content of How to use bootstrap to select the time of year, month and day. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template