jQuery UI插件之datepicker的自定义设置

1. 修改datepicker的外观颜色，在jquery.ui.theme.css里面修改.ui-widget-header的background的值为你想要的颜色，并且去掉后面到color属性之前的所有内容（主要是url）；还要修改.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default的background的值为你想要的颜色，并且去掉后面到color属性之前的所有内容（主要是url）

2. 设置datepicker的外观大小，因为datepicker控件是放在<div id=”ui-datepicker-div”></div>里面，所以只需在样式文件里对该div进行如下设置即可# ui-datepicker-div{font-size:62%;}

3. today和done按钮，只有设置showButtonPanel的值为true时，才可以显示today和done按钮面板，但是datepicker控件自带的today按钮的事件是当你的日历面板上没有当前日期的时候，你可以通过today按钮使日历面板直接跳转到当前日期，但是不能将当前日期显示到文本框中，要想将当前日期显示到文本框中，需要在jquery.ui.datepicker.js的_gotoToday函数最后加上this._selectDate(id, this._formatDate(inst, inst.selectedDay, inst.drawMonth, inst.drawYear));即可；datepicker自带的done按钮其实是关闭日历面板，可以通过$(".ui-datepicker-close").live("click", function() {datepicker_CurrentInput.value = ""; });实现清除文本框内所填日期；datepicker自带的这两个按钮，默认文本是today和done，我们可以通过设置datepicker的currentText: "今天",和closeText: "清除",改变这两个按钮的显示文本

4. 汉化问题，datepicker有一个汉化的js文件，只要在用到datepicker控件的页面引入该文件即可汉化datepicker控件的显示文字。但是汉化会带来一个问题，就是如果datepicker控件的changeMonth和changeYear属性设置为true的话，汉化后的年和月会显示在两行里，很难看，这是我们需要修改jquery.ui.datepicker.css里面的.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year { width: 45%;}（默认的width是49%）

5. 如果没有清空上一次选择的日期，刷新页面时，文本框里会保留上一次的日期，要想在重新加载页面的时候清除上一次所选的日期，可以通过以下方式实现：$(“#datepicker1”).attr(“value”,””);

给属性赋值：attr(“属性”,”属性值”);

获取属性的值：attr(“属性”);

jQuery UI插件之datepicker的自定义设置相关推荐

jQuery UI 插件
jQuery UI 插件 1.概述 1.简介 UI -> User Interface用户界面 jQuery UI是jQuery官方提供的插件,他强化了jQuery中搭载的动画效果及特效,以实现 ...
jQuery插件 -- jQuery UI插件
jQuery UI 主要分为3个部分: 交互.微件和效果库交互:这里都是一些与鼠标交互相关的内容.包括拖动(Draggable).置放(Doppable).缩放(Resizable).选择(Sele ...
jQuery UI插件sortable中文帮助文档
所有的事件回调函数都有两个参数:event和ui,浏览器自有event对象,和经过封装的ui对象 ui.helper - 表示sortable元素的JQuery对象,通常是当前元素的克隆对象 ui.p ...
JQuery之UI插件
1.拖曳插件之traggable 拖曳插件draggable的功能是拖动被绑定的元素,当这个jQuery UI插件与元素绑定后,可以通过调用draggable()方法,实现各种拖曳元素的效果,调用格式 ...
使用 jQuery UI Widget Factory 编写有状态的插件（Stateful Plugins）
使用 jQuery UI Widget Factory 编写有状态的插件(Stateful Plugins) 使用 jQuery UI Widget Factory 编写有状态的插件(Stateful ...
Jquery UI dialog弹出层插件
必须先下载Jquery UI插件然后再把下载的文档复制到项目中,可以复制你需要的单个插件 --------------------------------------具体代码如下---------- ...
jquery UI 跟随学习笔记——拖拽（Draggable）
jquery UI 跟随学习笔记--拖拽(Draggable) 引言这周暂时没有任务下达,所以老大给我的任务就是熟悉jquery相关插件,我就先选择了jquery UI 插件,以及jquery库学习 ...
jquery ui和easy ui联合使用
本文以jquery ui中的自动完成(autocomplete)插件, easy ui中的(tree)树形菜单插件,(grid)网格插件的综合运用为例来展示插件的魅力. 开发环境:struts2.3 ...
php 智能输入提示插件,PHP结合jQuery.autocomplete插件实现输入自动完成提示的功能_php实例...
我们在很多项目中使用了搜索功能来帮助用户更快更准确的找到想要的信息.本文将介绍如何实现用户输入自动提示的功能,就像谷歌百度搜索引擎一样,当用户输入关键字时,输入框下方会有提示,将与关键字相关的信息展现 ...

jQuery UI插件之datepicker的自定义设置

jQuery UI插件之datepicker的自定义设置相关推荐

最新文章

热门文章