jQueryのdatetimepickerで選択可能な時刻をカスタマイズする方法【allowTimes】

こんにちは。

ゆうや（@yuyaphotograph）です！

この記事では、

という方のお悩みを解決します！

この記事で紹介する「allowTimesパラメータを使用する方法」を実践すれば、数行のコードで選択可能な時刻を指定することができるようになります！

それではやり方を見ていきましょう〜

allowTimesパラメータで解決

以下のように、allowTimesパラメータに表示させたい時刻をオブジェクト形式で渡してあげればOKです！

下のコードは、「14時/15時/17時/19時」のみ選択可能にさせたい場合の記述となります。

$(function(){
  $('#datetimepicker').datetimepicker({
    allowTimes:[
      '14:00', '15:00', '17:00', '19:00'
    ]
  });
});

参考

まとめ

選択してほしい時間帯が予め決まっているイベントなどでの使用で活躍しそうなオプションでした！

datetimepicker関連のTipsを他にも興味ある方は以下の記事をチェックしてみてください〜！

スマホでinput要素のフォーカス時にキーボードを表示させない方法【readonly属性】

【’formatDate’ of null】jquery.datetimepicker.js使用時の注意点