Heim >Web-Frontend >js-Tutorial >Ausführliche Erläuterung der Verwendung der JS-Datums- und Zeitauswahl

Ausführliche Erläuterung der Verwendung der JS-Datums- und Zeitauswahl

php中世界最好的语言
php中世界最好的语言Original
2018-04-20 14:22:372785Durchsuche

Dieses Mal erkläre ich Ihnen ausführlich die Verwendung der JS-Datums-Zeitauswahl und welche Vorsichtsmaßnahmen bei der Verwendung der JS-Datums- und Zeitauswahl zu beachten sind Ein praktischer Fall.

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

Wenn Sie Webpack verwenden, müssen Sie Flatpickr importieren.

<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.

Die Konfiguration ist optional und wird im Objekt {} übergeben.

// commonjs
const flatpickr = require("flatpickr");
jQuery
// 如果可用,推荐使用 es 模块
import flatpickr from "flatpickr";

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

Zusammenfassung

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Für weitere spannende Inhalte zahlen Sie bitte Beachten Sie auch andere verwandte Artikel auf der chinesischen PHP-Website!
$(".selector").flatpickr(optional_config);

Empfohlene Lektüre: Vue+Axios Production Login Request Interception

Detaillierte Erläuterung der Webpack-Dev-Server-Nutzung ( mit Code )

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der Verwendung der JS-Datums- und Zeitauswahl. 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