1、下载JQuery
http://jquery.com/
http://jqueryui.com/
2、HTML页面
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>JQuery Datepicker</title>
<link type="text/css" href="script/jquery/theme/base/jquery-ui.css" rel="stylesheet" />
<link type="text/css" href="script/jquery/theme/base/jquery.ui.core.css" rel="stylesheet" />
<link type="text/css" href="script/jquery/theme/base/jquery.ui.theme.css" rel="stylesheet" />
<link type="text/css" href="script/jquery/theme/base/jquery.ui.accordion.css" rel="stylesheet" />
<script type="text/javascript" src="script/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="script/jquery/ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="script/jquery/ui/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="script/jquery/ui/i18n/jquery.ui.datepicker-ja.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var date=new Date();
var day=date.getDate();
day=parseInt(day)-1;
date=new Date(parseInt(date.getFullYear()),parseInt(date.getMonth())+1,0);
$("#datepicker").datepicker({
showOn:'button',
buttonImage:'image/calendar.gif',
buttonImageOnly:true,
minDate:-day,
maxDate:+parseInt(date.getDate())-day-1
});
});
function initAnother(){
if(document.getElementById("datepicker").value!=null){
$("#another").datepicker({minDate:'-3d'});
}
}
function initCalendar(){
if(document.getElementById("datepicker").value!=null){
$("#another").datepicker({minDate:'-3d'});
}
}
</script>
<style type="text/css">
.demo input,img{
vertical-align:middle;
}
</style>
</head>
<body>
<div class="demo">
date: <input type="text" id="datepicker" onchange="initAnother()">
<br/><br/>
date: <input type="text" id="another" onfocus="initCalendar()">
</div>
</body>
</html>
分享到:
相关推荐
jquery datepicker日期选择插件鼠标点击text jquery datepicker日期选择插件鼠标点击text jquery datepicker日期选择插件鼠标点击text jquery datepicker日期选择插件鼠标点击text
jQuery UI中的`datepicker`是一个非常流行的JavaScript组件,用于在网页上添加日历选择功能。它提供了丰富的自定义选项,使得日期选择器可以适应各种界面设计和功能需求。在这个"jquery datepicker 小例子"中,我们...
**jQuery Datepicker** 是一个广泛使用的JavaScript库,用于在网页上添加交互式的日期选择功能。这个库基于流行的jQuery框架,提供了丰富的自定义选项,样式美观,兼容性良好,且支持多语言,使得它在全球范围内非常...
`jQuery UI Datepicker` 是一个流行的 JavaScript 库,用于在网页上添加日期选择功能。它源自 jQuery 库,提供了一种简单、用户友好的方式来处理日期输入。在这个特定的场景中,我们不仅关注基本的日期选择,还涉及...
首先,要使用jQuery的datepicker,你需要引入jQuery UI库,它包含了datepicker组件。你可以从官方站点(https://jqueryui.com/)下载最新版本,或者通过CDN(内容分发网络)链接将其添加到你的HTML文件中。例如: `...
jQuery Datepicker用到的js和CSS文件 jquery-ui.css jquery-ui-timepicker-addon.css jquery-1.7.2.js jquery-ui.min.js jquery-ui-timepicker-addon.js jquery-ui-sliderAccess.js jquery-ui-timepicker-zh-CN.js
在网页开发中,jQuery UI 的 Datepicker 是一个广泛使用的组件,它为用户提供了方便的日期选择功能。然而,原生的 Datepicker 默认情况下只允许选择单个日期。本主题将深入探讨如何通过扩展和定制,实现 jQuery ...
jquery datepicker today clear 扩展实现,全网惟一资源。 当时项目要用,在网上没找到现成的,找到的都是需要修改源代码的,自己最后看源码实现的扩展,没有污染源码,如果项目有需要,拿去直接用就行了。 而且日期...
jQuery UI中的日期选择器(DatePicker)是一个非常流行的前端组件,用于在网页上提供方便的日期输入功能。这个组件使得用户可以以日历的形式选择日期,而不是手动输入,从而提高了用户体验和数据准确性。以下是对`...
jQuery Datepicker 是一个非常流行的前端开发插件,用于在网页中添加日期选择功能。这个插件是jQuery UI库的一部分,提供了丰富的自定义选项和多语言支持,使得在网页上实现美观且用户友好的日期输入变得简单。在本...
jquery datepicker 的中文包 调用方法 <script src="./public/js/jquery-ui-1.10.3.min.js"> <script src="./public/js/jquery.datepicker-zh-CN.js"></script> <link href="./public/css/jqueryui/jquery-ui-...
jQuery UI Datepicker是一个非常流行的JavaScript库,用于在网页上添加日期选择器功能。这个库是jQuery UI框架的一部分,提供了一种优雅、用户友好的方式来输入或选择日期。以下是对`jQuery UI Datepicker`的详细...
日期选择器在网页开发中是常见的一种交互组件,它能够帮助用户方便地选取日期,而jQuery UI中的datepicker组件就是这样一个强大的工具。本文将详细介绍如何在项目中使用jQuery UI的datepicker,以及它的一些主要功能...
《jQuery Datepicker:超牛日历显示控件的深度解析》 在Web开发中,日期选择器是一个不可或缺的组件,它极大地提升了用户交互体验。jQuery UI中的Datepicker控件就是一个非常强大且灵活的日历插件,它能轻松满足...
jQuery UI的日期选择器(jQuery datepicker)是一个广泛使用的组件,尤其在网页表单中用于输入日期时。这个组件提供了一个优雅、用户友好的界面,允许用户通过日历视图来选择日期,而不是手动输入。在中文环境中,...
**AngularJS 封装 jQuery Datepicker 知识点详解** 在Web开发中,日期选择器是一个常见的组件,用于用户输入日期或选择日期范围。AngularJS 和 jQuery 的结合使用可以为开发者提供更强大的功能和更好的用户体验。这...
jQuery UI中的Datepicker日历组件是一款广泛使用的JavaScript插件,它为网页添加了美观、功能丰富的日期选择功能。这个组件是jQuery UI库的一部分,提供了多种样式、语言支持以及可定制的选项,使得开发者能够轻松地...
《jQuery日期时间选择器datepicker深度解析》 在Web开发中,日期和时间的选择是一个常见的功能需求,用户界面的友好性和易用性对于提升用户体验至关重要。jQuery的datepicker插件以其丰富的功能和灵活的定制性,...
jquery datepicker cn en