JSFiddle - React, Tailwind, and code Playground

by Tihomir Totev

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.3/inputmask/inputmask.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.3/inputmask/jquery.inputmask.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.3/inputmask/inputmask.regex.extensions.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.3/inputmask/inputmask.date.extensions.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  
  
  <input name="field1" id="field1" class="inputmask" data-inputmask="'mask': 'h:s t\\m','placeholder': 'hh:mm xm', 'hourFormat': '12', 'alias': 'datetime', 'autoUnmask' : true"/>

JavaScript

function generateTime(){
var times = ["MON",'TUE','WED'];
return times;
}


$('.inputmask').inputmask();
$('.inputmask').autocomplete({
      source: generateTime()
});