JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://code.jquery.com/ui/1.9.1/themes/smoothness/jquery-ui.css">
<link rel="stylesheet" href="https://trentrichardson.com/examples/timepicker/jquery-ui-timepicker-addon.css">
<script src="https://code.jquery.com/jquery-2.1.1.js"></script>
<script src="https://code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<div class="example-container">
<div>
<input type="text" name="basic_example_1" id="basic_example_1" value="" />
</div>
</div>
JavaScript
/*! jQuery Timepicker Addon - v1.5.0 - 2014-09-01
* http://trentrichardson.com/examples/timepicker
* Copyright (c) 2014 Trent Richardson; Licensed MIT */
(function ($) {
/*
* Lets not redefine timepicker, Prevent "Uncaught RangeError: Maximum call stack size exceeded"
*/
$.ui.timepicker = $.ui.timepicker || {};
if ($.ui.timepicker.version) {
return;
}
/*
* Extend jQueryUI, get it started with our version number
*/
$.extend($.ui, {
timepicker: {
version: "1.5.0"
}
});
/*
* Timepicker manager.
* Use the singleton instance of this class, $.timepicker, to interact with the time picker.
* Settings for (groups of) time pickers are maintained in an instance object,
* allowing multiple different settings on the same page.
*/
var Timepicker = function () {
this.regional = []; // Available regional settings, indexed by language code
this.regional[''] = { // Default regional settings
currentText: 'Now',
closeText: 'Done',
amNames: ['AM', 'A'],
pmNames: ['PM', 'P'],
timeFormat: 'HH:mm',
timeSuffix: '',
timeOnlyTitle: 'Choose Time',
timeText: 'Time',
hourText: 'Hour',
minuteText: 'Minute',
secondText: 'Second',
millisecText: 'Millisecond',
microsecText: 'Microsecond',
timezoneText: 'Time Zone',
isRTL: false
};
this._defaults = { // Global defaults for all the datetime picker instances
showButtonPanel: true,
timeOnly: false,
timeOnlyShowDate: false,
showHour: null,
showMinute: null,
showSecond: null,
showMillisec: null,
showMicrosec: null,
showTimezone: null,
showTime: true,
stepHour: 1,
stepMinute: 1,
stepSecond: 1,
stepMillisec: 1,
stepMicrosec: 1,
hour: 0,
minute: 0,
second: 0,
millisec: 0,
microsec: 0,
timezone: null,
hourMin: 0,
minuteMin: 0,
secondMin: 0,
millisecMin: 0,
microsecMin: 0,
hourMax: 23,
minuteMax: 59,
secondMax: 59,
millisecMax: 999,
microsecMax: 999,
minDateTime:...