a、引用 CSS 、js
<link type="text/css" href="<%=basePath %>css/themes/base/ui.base.css" rel="stylesheet" />
<!-- Datepicker 样式及其颜色 -->
<link rel="stylesheet" href="<%=basePath %>css/themes/base/blue2.css" type="text/css"></link>
<script type="text/javascript" src="<%=basePath%>js/utils/jquery-1.3.2.js"></script>
<script type="text/javascript" src="<%=basePath%>utils/jQueryUI/ui.core.js"></script>
<script type="text/javascript" src="<%=basePath%>js/utils/jQueryUI/ui.datepicker.js"></script>
$('#id').datepicker();
b、格式化时间
$('#id').datepicker({dateFormat:'yy-mm-dd'});
c、汉化
function Page(){
}
Page.prototype = {
initJQueryDatePicker : function(){
if(!$){
alert('你的页面不支持jQuery1.3.2');
return;
}
$.datepicker.regional['zh-CN'] =
{
clearText: '清除', clearStatus: '清除已选日期',
closeText: '关闭', closeStatus: '不改变当前选择',
prevText: '<上月', prevStatus: '显示上月',
nextText: '下月>', nextStatus: '显示下月',
currentText: '今天', currentStatus: '显示本月',
monthNames: ['一月','二月','三月','四月','五月','六月',
'七月','八月','九月','十月','十一月','十二月'],
monthNamesShort: ['一','二','三','四','五','六',
'七','八','九','十','十一','十二'],
monthStatus: '选择月份', yearStatus: '选择年份',
weekHeader: '周', weekStatus: '年内周次',
dayNames: ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
dayNamesShort: ['周日','周一','周二','周三','周四','周五','周六'],
dayNamesMin: ['日','一','二','三','四','五','六'],
dayStatus: '设置 DD 为一周起始', dateStatus: '选择 m月 d日, DD',
dateFormat: 'yy-mm-dd', firstDay: 1,
initStatus: '请选择日期', isRTL: false
};
$.datepicker.setDefaults($.datepicker.regional['zh-CN']);
}
};
官网: http://docs.jquery.com/UI/Datepicker
分享到:
相关推荐
而`jquery.datePicker`是jQuery的一个扩展插件,用于实现日期选择功能,通常与输入框(input[type="text"])结合使用,为用户提供一个友好的日期选择界面。这个插件提供了丰富的自定义选项和灵活的API,可以方便地...
`jquery.datePicker`是一款在网页中常用的JavaScript库,用于实现日期选择功能,它基于流行的jQuery框架,能够方便地为输入框...通过熟练掌握其使用方法和配置选项,开发者可以轻松创建符合项目需求的日期选择功能。
`jQuery UI Datepicker`是jQuery库的一个扩展,用于在网页上创建交互式日期选择器。这个控件使得用户能够方便地选择日期,广泛应用于表单输入、日程管理和其他需要日期选择的应用场景。以下是关于`jQuery UI ...
jQuery UI中的Datepicker是一个广泛使用的日期选择器插件,而在这里我们讨论的是其增强版,增加了对时间输入的支持。这篇文章将深入探讨这个增强版的jQuery UI Datepicker,如何实现时间输入功能,并通过源码分析,...
本文将深入探讨这个插件的使用方法、核心功能以及如何对其进行定制。 首先,我们来了解下jQuery Mobile Datepicker的基础。这个插件的核心在于其交互性与响应式设计,使得在不同屏幕尺寸的设备上都能有良好的用户...
在IT行业中,JavaScript库和框架极大地简化了网页开发工作,jQuery和jQuery UI是其中非常流行的两个工具。本文将深入探讨这两个库以及它们在EasyUI框架中的应用。 首先,jQuery(通常简写为 `$`)是一个轻量级的...
4. **用法.js**: 这个文件应该包含使用jQuery Mobile Datepicker的示例代码或教程,帮助开发者了解如何在项目中集成和配置这个插件。 集成和使用jQuery Mobile Datepicker的基本步骤包括引入相关JS和CSS文件,初始...
接下来,将详细介绍推荐的三款日期选择插件:My97DatePicker、jquery.datepicker和Mobiscroll,并详细介绍它们各自的特点、使用方法以及适用场景。 1. My97DatePicker My97DatePicker是一款纯原生JS开发的日期选择...
3. 使用方法: 使用datePicker只需在HTML元素上添加特定的类或ID,并调用jQuery的`.datepicker()`方法。例如,你可以在一个`<input>`标签中添加`class="datepicker"`,然后在文档加载完成后调用`$(".datepicker")....
**jQuery-datepicker**是一个广泛使用的JavaScript库,它是基于jQuery的一个组件,专门用于实现日期选择器功能。这个组件在网页中提供了一个交互式的日历控件,允许用户方便地选择日期,通常用于输入表单中的日期...
在使用`jQuery DatePicker`之前,你需要确保已经安装了jQuery库和jQuery UI库。可以通过CDN链接直接引入,或者下载后本地引入到项目中: ```html <!-- 引入jQuery --> <script src="https://code.jquery....
jQuery UI Datepicker是一款广泛使用的JavaScript库,它是jQuery UI框架的一部分,专门用于添加日期选择功能到网页上。这个组件提供了一个美观、用户友好的日历界面,使得用户可以方便地选择日期,大大提升了网页的...
要使用jQuery Datepicker,首先需要在HTML中创建一个input元素,通常类型为"text",然后通过JavaScript调用`.datepicker()`方法绑定到该元素。例如: ```html <input type="text" id="datePicker"> ``` ```...
jQuery UI是基于jQuery的用户界面库,包含一组可复用的组件,如对话框(Dialog)、日历(Datepicker)、拖放(Draggable)、可排序(Sortable)和效果(Effects)。在本案例中,虽然只提及了`jQuery-UI-Reference-...
本文将详细介绍如何在项目中使用jQuery UI的datepicker,以及它的一些主要功能和配置选项。 jQuery UI的datepicker是一个轻量级、可自定义的日期选择器插件,它通过简单的API接口可以轻松集成到任何HTML页面中。...
3. **jquery.ui.datepicker.js**:这是jQuery UI中的一个特定组件,用于实现日期选择器功能。它可以方便地添加到输入字段,允许用户通过一个友好的日历来选择日期。日期选择器通常在需要用户输入日期的表单或日程...
在本文中,我们将详细探讨jQuery datePicker的主要特性、使用方法以及如何将其集成到您的项目中。 1. **主要特性**: - **用户友好**:jQuery datePicker 设计优雅,易于操作,为用户提供了一种直观的方式来选择...
要使用`jQuery datePicker`,首先确保在页面中引入了`jQuery`库和`jQuery UI`库。通常,我们需要以下两行代码: ```html <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> ...
《jQuery插件datepicker的使用详解》 jQuery,作为JavaScript库的杰出代表,为开发者提供了丰富的功能和便捷的API,使得前端开发变得...掌握其使用方法,无疑会提升你的前端开发能力,为用户提供更优质的交互体验。
2. **初始化插件**:通过jQuery的选择器找到需要添加日期选择功能的元素,然后调用`.DatePicker()`方法进行初始化。你可以传递参数来定制DatePicker的行为,如设定默认日期、改变日期格式等。 ```javascript $...