`
Franciswmf
  • 浏览: 799913 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

jquery ui datepicker

 
阅读更多




<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" href="<%=basePath%>jqueryui/development-bundle/themes/base/jquery.ui.all.css">
	<script src="<%=basePath%>jqueryui/development-bundle/jquery-1.9.1.js"></script>
	<script src="<%=basePath%>jqueryui/js/jquery-ui-1.10.3.custom.js"></script>
	<script src="<%=basePath%>jqueryui/development-bundle/ui/jquery.ui.core.js"></script>
	<script src="<%=basePath%>jqueryui/development-bundle/ui/jquery.ui.widget.js"></script>
	<script src="<%=basePath%>jqueryui/development-bundle/ui/jquery.ui.datepicker.js"></script>
	<script src="<%=basePath%>jqueryui/development-bundle/ui/i18n/jquery.ui.datepicker-zh-CN.js"></script>
	<link rel="stylesheet" href="<%=basePath%>jqueryui/development-bundle/demos/demos.css">
	<script>
	$(function() {
		$( "#startDate" ).datepicker({  
			    showAnim:'drop',
			    showButtonPanel:true,
			    dateFormat:"yy-mm-dd",
			}); 
	});
	$(function() {
		$( "#endDate" ).datepicker({  
			     showAnim:'bounce',
			    showButtonPanel:true,
			    dateFormat:"yy-mm-dd",
			}); 
	});
	</script>
</head>
<body>

<p>startDate: <input type="text" id="startDate" name="startDate">   
endDate: <input type="text" id="endDate" name="endDate"></p>

<div class="demo-description">
<p>The datepicker is tied to a standard form input field.  Focus on the input (click, or use the tab key) to open an interactive calendar in a small overlay.  Choose a date, click elsewhere on the page (blur the input), or hit the Esc key to close. If a date is chosen, feedback is shown as the input's value.</p>
</div>
</body>
</html>
  • 大小: 11.2 KB
分享到:
评论

相关推荐

    jQuery UI Datepicker插件timepicker时分秒

    《jQuery UI Datepicker插件与timepicker时分秒扩展详解》 在Web开发中,日期和时间的选择常常是一项必不可少的功能,jQuery UI Datepicker插件是一个非常流行的选择工具,它为用户提供了直观、易于使用的日期选择...

    jquery ui datepicker all theme

    《jQuery UI Datepicker全主题详解》 在网页开发中,日期选择器是一个常见的交互元素,它使得用户能够方便地输入或选择日期。jQuery UI库中的Datepicker组件是此类功能的一个强大实现,它提供了丰富的功能和多样的...

    jQuery UI Datepicker IE8 使用的基本解决方法70-1

    jQuery UI Datepicker IE8 使用的基本解决方法:解决:IE8无法响应其中jquery.ui.datepicker部分标签a(无href)的onclick事件,和td由于放入标签a href="#",无法响应自身onclick事件,只验证了icon-trigger模式,...

    修改Jquery UI DatePicker 可以选择时间

    简要修改Jquery UI DatePicker,可以选择时间(小时,分),有需要的朋友可以参考一下。 补充说明:上面的代码做好后,没怎么测试,选择的时间是有问题的:问题1:选择的月份比当前月份少1,问题2:当选择的月份和...

    jQuery UI Datepicker - Select a Date Rang

    《jQuery UI Datepicker - 选择日期范围》 在网页开发中,用户经常需要进行日期的选择,例如填写报告、预订服务或者设置提醒等。jQuery UI Datepicker 是一款强大的、可定制的日期选择插件,它提供了丰富的功能和...

    jQueryUI datepicker

    jQuery UI Datepicker是一款广泛使用的JavaScript库,它是jQuery UI框架的一部分,专门用于添加日期选择功能到网页上。这个插件提供了一种优雅的方式来显示和选择日期,可以与timepicker插件结合,形成一个完整的...

    jquery.ui.datepicker.js

    日期选择插件Datepicker是一个配置灵活的插件,我们可以自定义其展示方式,包括日期格式、语言、限制选择日期范围、添加相关按钮以及其它导航等。

    jQueryUI DatePicker:禁用一周中的几天

    @Scripts.Render("~/bundles/jqueryui") &lt;!-- 假设你已经配置好 jQuery UI 的脚本捆绑包 --&gt; $(function() { $("#datepicker").datepicker({ beforeShowDay: function(date) { var day = date.getDay(); ...

    jQuery ui Datepicker日期插件

    jquery的日期插件Datepicker,这两天正好研究完了,将研究结果分享下,单独的封装汉化版本,都有注释,好修改也好使用,注意保持images里面图片的名称和路径,red-datepicker.css可以定义日期div的样式,我自己在源...

    jquery-ui-1.10.3.custom.rar jquery 日期插件 带时间选择

    `timepicker-addon`是一个扩展了jQuery UI datepicker的插件,它增加了对时间选择的支持。集成这个插件后,用户可以在同一个界面上同时选择日期和时间。 在实际项目中,我们可以这样配置日期时间选择器: ```...

    jquery UI Datepicker时间控件的使用方法(终结版)

    jQuery UI Datepicker是一个强大的日期选择器插件,它允许用户通过图形界面选择日期。这个插件是jQuery UI库的一部分,其设计目的在于提供一个可高度定制化的日期选择器控件。在这个终结版的教程中,我们会详细介绍...

    jquery.datepicker 日期控件

    `jQuery UI Datepicker`是jQuery库的一个扩展,用于在网页上创建交互式日期选择器。这个控件使得用户能够方便地选择日期,广泛应用于表单输入、日程管理和其他需要日期选择的应用场景。以下是关于`jQuery UI ...

    jquery ui datepicker demo

    NULL 博文链接:https://flyer0126.iteye.com/blog/946177

    jQuery ui-datepicker最好用的日历控件

    **jQuery UI Datepicker是最受欢迎的JavaScript日历插件之一,尤其在jQuery库的广泛使用下,它成为开发人员实现日期选择功能的首选工具。本文将深入探讨Datepicker控件的关键特性、使用方法以及如何与其他技术如Java...

    jquery.datepicker-zh-CN.js

    jquery datepicker 的中文包...&lt;link href="./public/css/jqueryui/jquery-ui-1.10.3.min.css" rel="stylesheet"&gt; $( "#datepicker" ).datepicker({dateFormat:"yy-mm-dd",regional:$.datepicker.regional['zh-CN']});

    jquery ui利用datepicker插件实现日期控件

    《jQuery UI中的Datepicker插件实现日期控件详解》 在网页开发中,日期选择控件是不可或缺的一部分,它能够方便用户输入或选择日期,提高交互体验。jQuery UI库提供了一个强大的Datepicker插件,使得创建这样的控件...

    Jquery ui datepicker设置日期范围,如只能隔3天【实现代码】

    你可以通过访问jQuery UI的官方网站(http://jqueryui.com/download/)来下载相应的版本,例如这里使用的1.9.2版本。引入文件的HTML代码如下: ```html &lt;link href="jquery-ui/1.9.2/css/smoothness/jquery-ui-...

    jquery mobile datepicker

    **jQuery Mobile Datepicker** 是一个专门用于移动设备的日期选择器插件,它扩展了标准的jQuery UI Datepicker,使其更适合在触摸屏设备上使用。这个插件在原生的日期选择器基础上增加了对移动环境的优化,如响应式...

    基于JQuery UI的datepicker二次开发 支持时分秒(带示例)

    在本文中,我们将深入探讨如何基于JQuery UI的datepicker进行二次开发,以实现对时分秒的支持,并且提供皮肤切换的功能。JQuery UI是一个强大的JavaScript库,提供了多种用户界面组件,其中datepicker是一个常用的...

    jquery datepicker 时分秒

    首先,为了实现`jQuery UI Datepicker`,你需要先从官方网站(https://jqueryui.com/datepicker/)下载最新的版本。`jquery-ui-1.8.16.custom.zip`这个文件名表明这是一个自定义构建的版本,可能包含了特定的功能集...

Global site tag (gtag.js) - Google Analytics