Tell me, what time is it right now?
Go ahead and type the current time in your side of the world. Finish with TAB or ENTER
Did the plugin understand what you typed?
jQuery Timepicker can parse the most used time representations allowing you and your users to enter time using their prefered way for writing it.
Do you prefer to use the mouse to interact with websites? We got you covered. If writing is not your thing, you can also choose time entries from a dropdown of options. Please click the input field below to try it out.
To use jQuery Timepicker you'll need to include two files: jquery.timepicker.min.js and jquery.timepicker.min.css. Then, assuming you have an <input> element in your document, with class timepicker, you can use the code on the right (or the code below, if you are reading on mobile) to initialize the plugin.
$(document).ready(function(){
$('input.timepicker').timepicker({});
});The plugin is available from different sources, choose the one that goes better with your project!
npm i jquery-timepickerbower install jquery-timepicker-wvega --savejQuery Timepicker is available in cdnjs. To get a list of all avaiable versions and files, go to https://cdnjs.com/libraries/timepicker. Alternatively, use the code below to include just the necessary stylesheet and script in your website.
Paste the following code inside the <head> element of your page:
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">Paste the following code before the </body> tag:
<script src="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>The latest version of jQuery Timepicker is also available for download from GitHub.
jQuery Timepicker offers several configuration options. Use the demo below to adjust its behaviour to your needs. If you are interested in a detailed description of each of the options available, please go to the options page.
$('.timepicker').timepicker({
});
You can post bugs reports and feature suggestions to GitHub.
If you are having problems using the plugin, please post a question to Stack Overflow using jquery and timepicker as tags; I or someone from the community will surely help.
Whether your are submitting a bug report or asking for help at Stack Overflow, please try to include an example demonstrating your problem.