flatpickr - にほんご。

Mobile Support

更新日: 2018-09-05

ネイティブの日付入力について

モバイルブラウザでアクセスした場合、自動的にネイティブの日付選択ボックスに変わります。

ユーザーはネイティブの日付選択ボックスを使い慣れているので、とても優れたUXを提供します。

特別な設定は不要です。onChangeのようなコールバックも同じように動きます。

しかし、ネイティブの日付選択では以下の機能のみに制限されています。

  • 日付、日時の初期値設定
  • 最小(最も早い)日付指定
  • 最大(最も遅い)日付指定

そのため、特定の機能(例えば特定日を無効化)を利用した場合は、ネイティブ日付選択ではなく、flatpickrの日付選択機能が作動します。

もし常にネイティブの日付選択を無効化したい場合(推奨しませんが)はdisableMobileオプションを有効化します。


デモ

モバイルブラウザでアクセスした場合も常にflatpickrを有効化します。

JavaScript
const config =  {
  disableMobile: "true"
}
flatpickr('.flatpickr', config);
HTML
<input class="flatpickr" type="text" placeholder="Select Date.." readonly="readonly">


© 2017 Gregory Petrosyan Released under the MIT license

このコンテンツはGregory Petrosyan(chmln)によるflatpickrドキュメントを翻訳/改変したものです。