Implementieren Sie die JS-Datums-/Uhrzeitauswahl

Dieses Mal werde ich Ihnen die Implementierung des JS-Datums- Zeitselektors und die Vorsichtsmaßnahmen für die Implementierung des JS-Datums- und Zeitselektors vorstellen. Nehmen wir das Folgende als einen praktischen Fall ein Blick.

flatpickr ist ein leichter, Lean-fokussierter, UX-gesteuerter und erweiterbarer JavaScript Datetime-Picker.

Demo GitHub herunterladen

flatpickr ist von keiner Bibliothek abhängig. Kleinere Benutzeroberfläche, aber viele Themen. Eine umfangreiche API und ein Ereignissystem machen es für jede Umgebung geeignet. Verfügbar mit Webpack und als jQuery-Plugin.

Installieren Sie das Flatpickr-Modul mit NPM. Paketverwaltungstool: https://www.npmjs.com/package/bower-npm-resolver

Nicht-Modul-Umgebung

Flatpickr-Dateien direkt einführen

# using npm install
npm i flatpickr --save

Verwendung

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>

Im Folgenden finden Sie gültige Methoden zum Erstellen von Flatpickr-Instanzen.

// commonjs
const flatpickr = require("flatpickr");

// 如果可用，推荐使用 es 模块
import flatpickr from "flatpickr";

// 如果在框架中使用 flatpickr ，则建议直接传递该元素
flatpickr(element, {});
// 选择器也被支持
flatpickr("#myID", {});
// 创建多个实例
flatpickr(".anotherSelector");

$(".selector").flatpickr(optional_config);

So implementieren Sie die Gerüstoptimierung im Webpack

Wie Sie die Missverständnisse bei der Verwendung von Dom in Angular vermeiden

Detaillierte Schritte von Webpack v4 von Dev zu PRD

Das obige ist der detaillierte Inhalt vonImplementieren Sie die JS-Datums-/Uhrzeitauswahl. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!