Cómo utilizar el complemento de selección de fechas de bootstrap

Primero, descarguemos este control de fecha. Se puede utilizar Baidu bootstrap-daterangepicker.

2

Descarga y descomprime el archivo, como se muestra en la imagen.

Los archivos principales son

daterangepicker.js

moment.js

bootstrap.min.css

daterangepicker -bs3.css

Es decir, dos archivos js y dos archivos css.

3

Abramos la demostración y echemos un vistazo.

Este calendario funciona bien y está en muy buen estado.

4

Abra el código de demostración. Usaré esta demostración como ejemplo para presentar el uso del control de fecha.

Primero, podemos ver que hay una entrada aquí.

Luego, coloque el id de la entrada como "#reservation" en js para convertirlo en un control de fecha.

Activar el control de fecha es muy simple (sin método de parámetro)

$('#reservation').daterangepicker();

Esto crea la fecha más simple recogedor.

5

Los calendarios con parámetros pueden elegir el selector de fecha a utilizar modificando los parámetros de inicialización.

Los controles de Bootstrap siguen siendo bastante potentes y pueden hacer casi cualquier cosa que quieras.

Puede obtener una variedad de formatos de selección de fecha en la configuración de parámetros

6

La lista de parámetros específicos se puede encontrar en el sitio web oficial de bootstrap, y el La introducción también es bastante clara.

Pero en términos generales, no se usa mucho. Las únicas cosas que deben cambiarse son el formato, WeekStart, StartView, etc.