datetimepicker 使用示例

最新推荐文章于 2025-11-23 06:18:13 发布

原创最新推荐文章于 2025-11-23 06:18:13 发布 · 3k 阅读

1 ·

CC 4.0 BY-SA版权

JavaScript 专栏收录该内容

11 篇文章

订阅专栏

本文介绍如何利用jQuery datetimepicker插件在网页上实现一个可让用户选择日期和时间的输入框。通过简单的HTML、CSS及JavaScript代码示例，展示了如何配置中文语言环境、时间格式以及限制可选日期范围。

使用方法：

添加jquery.min.js、datetimepicker.main.js和datetimepicker.css到您的页面：

<link rel="stylesheet" type="text/css" href="jquery.datetimepicker.css"/ >
<script src="jquery.main.js"></script>
<script src="jquery.datetimepicker.main.js"></script>

在html中：

<input type="text" id="add_lease_time"  style="width:200px" class="textbox inputtext" value="请选择时间"/>

在js中：

<script>
$.datetimepicker.setLocale('ch');//语言设置成中文
$('#add_lease_time').datetimepicker({
	  format: 'Y/m/d H:i:s', //设置时间格式
	  timepicker:true,       //显示timepicker
	  minDate:0              //之前日期不能选择
	});
</script>