`

基于jquery的下拉框式 日期控件

阅读更多
前段时做了一个网站项目,用到目前比较流行的强悍的日期控件,结果客户不喜欢,说好上网上的不会用。要简洁、简单。嘿,后来没办法,自己上手从写了一个。结果客户很满意。嘿。不再说废话,上代码:
高手们看了,提点意见啊。呵,不要只笑话! (例子中有全代码。)
/*
*  日期下拉框。
* Copyright: Copyright (c) 2009 Company: ***软件科技有限公司 *
* @author jianghuatao
* @date 2009-4-07
*/

/**
* @param jqueryObj jquery类型 年下拉框
* @param defaultValue string 默认值
*/
function inityear(jqueryObj, defaultValue){
//jqueryObj.append("<option value=''>--不限--</option>");
defaultValue = (defaultValue == undefined) ? "0" : defaultValue;
for (var i = 1930; i <= 1990; i++){
jqueryObj.append("<option value='" + i + ((i != defaultValue)?"'>":"' selected>") + i + "</option>");
}
}

/**
* @param jqueryObj jquery类型 月下拉框
* @param defaultValue string 默认值
*/
function initmonth(jqueryObj, defaultValue){
//jqueryObj.append("<option value=''>--不限--</option>");
defaultValue = (defaultValue == undefined) ? "0" : defaultValue;
for (var i = 1; i <= 12; i++){
jqueryObj.append("<option value='" + ((i<10)? ("0" + i) : i)  + ((i != defaultValue)?"'>":"' selected>") + ((i<10)? ("0" + i) : i)  + "</option>");
}
}

/**
* @param jqueryObj jquery类型 日下拉框
* @param days int 天数
* @param defaultValue string 默认值
*/
function initday(jqueryObj, days,defaultValue){
//jqueryObj.append("<option value=''>--不限--</option>");
jqueryObj[0].options.length = 1;
days = (days == undefined) ? 31 : days;
defaultValue = (defaultValue == undefined) ? "0" : defaultValue;
for (var i = 1; i <= days; i++){
jqueryObj.append("<option value='" + ((i<10)? ("0" + i) : i) + ((i != defaultValue)?"'>":"' selected>") + ((i<10)? ("0" + i) : i) + "</option>");
}
}

/**
* @param yearId string 年下拉框id
* @param monthId string 月下拉框id
* @param dayId string 日下拉框id
*/
function changedate(yearId,monthId,dayId){

var jqyear = $("#" + yearId);
var jqmonth = $("#" + monthId);
var jqday = $("#" + dayId);
var year = parseInt(jqyear.val(),10);
var month = parseInt(jqmonth.val(),10);
var day = parseInt(jqday.val(),10);

if(isNaN(year)) return;
if(isNaN(month)) return;

var isLeapYear=((year % 4 == 0 && year % 100 != 0) || year % 400 == 0) ? true : false;
var daysOfMonth=[31,28,31,30,31,30,31,31,30,31,30,31];
daysOfMonth[1] = isLeapYear ? 29 : 28;
initday(jqday,daysOfMonth[month - 1],day);
}

0
0
分享到:
评论
2 楼 yin29979 2012-07-12  
不支持IE9啊
1 楼 topbox163 2009-09-24  
年份最大:1990,如果到2999,最好不过了

出年日期?-》出生日期

相关推荐

    jquery下拉多选复选框插件

    总之,这个jQuery下拉多选复选框插件涉及了前端开发的多个方面,包括jQuery的使用、前后端交互、用户体验设计、插件定制和性能优化等。熟练掌握这些知识点,不仅能够帮助你有效地利用这个插件,也对提升整体的Web...

    jQuery下拉日期选择插件.zip

    jQuery下拉日期选择插件是基于流行的JavaScript库jQuery构建的,它提供了一个简洁的界面,用户只需点击输入框,就能触发一个下拉菜单。这个菜单不仅包含“今天”的选项,还提供了过去七天、过去一年、上个月等常见...

    下拉式日历控件

    10. **可定制性**:为了满足不同项目的需求,下拉式日历控件通常提供多种配置选项,如颜色主题、日期范围、预设日期等,允许开发者根据项目需求进行定制。 综上所述,下拉式日历控件的设计与实现涵盖了用户界面设计...

    js下拉复选框控件,超经典,用了就知道了。

    jQuery UI是一个流行的JavaScript库,提供了许多交互式的UI组件,包括下拉复选框控件。这个插件由Evan Hynds开发,可能包含源代码、示例、文档以及可能的资源文件。 jQuery UI的多选框插件(Multiselect Widget)是...

    LigerUI是基于jQuery开发的一系列控件组

    2. **表单控件**:LigerUI提供了各种表单控件,如文本输入框、下拉选择框、复选框、单选按钮等,还支持验证功能,确保用户输入的数据符合预设规则。这些控件可以通过简单的配置实现丰富的样式和行为。 3. **布局...

    asp.net 真正的下拉日期控件

    但“真正的下拉日期控件”可能指的是一个具有更友好、更直观的交互设计的自定义控件,可能是下拉式菜单的形式,允许用户快速选择日期而无需打开一个完整的日历视图。 这个控件可能具备以下特点: 1. **下拉样式**:...

    jquery 时间控件实例

    首先,我们需要了解jQuery的时间控件主要有两种类型:下拉式时间和滑动式时间选择器。下拉式时间控件通常由小时和分钟的下拉菜单组成,用户通过选择菜单中的选项来设定时间。滑动式时间选择器则提供一种更现代的触摸...

    日期控件 日期选择 日期控件 日期选择

    - 下拉框式:这种控件提供一个下拉菜单,用户从中选择日期。简单但可能不适用于需要频繁更改日期的情况。 - 日历小部件:显示一个完整的日历视图,用户可以直观地滚动月份和选择日期。 - 输入框+按钮:用户可以...

    ASP日期控件演示及代码

    "动网下拉日期"可能是一个下拉框式的日期选择控件,它提供了日、月、年的下拉列表,用户可以通过选择来设定日期。这种控件的优点在于它可以节省页面空间,且易于用户操作。通常,开发者会使用JavaScript或者jQuery库...

    jQuery日期选择器控件

    jQuery日期选择器控件是一种广泛应用于网页开发中的交互组件,它允许用户以友好的界面选择日期,极大地提升了用户的输入体验。这个控件以其简约的设计和丰富的功能,深受开发者喜爱。在HTML、CSS和JavaScript的加持...

    bootstrap-daterangepicker- 基于 Bootstrap 框架的日期范围选择控件

    8. **响应式设计**:基于 Bootstrap,daterangepicker 自带响应式布局,能适应不同设备和屏幕尺寸。 **依赖库** - **jQuery**:daterangepicker 使用 jQuery 进行 DOM 操作和事件处理,`jquery.min.js` 是必需的。...

    基于jQuery_常用控件收集

    **基于jQuery的常用控件收集** 在Web开发中,jQuery是一个非常重要的JavaScript库,它极大地简化了DOM操作、事件处理、动画制作以及Ajax交互。这篇博客主要探讨的是如何利用jQuery来构建和使用一些常见的UI控件,...

    jQuery日期时间选择器,基于jQuery1.7.1

    在这个特定的场景中,我们关注的是一个基于jQuery的日期时间选择器,适用于那些需要用户输入日期和时间的Web应用。该选择器是针对jQuery 1.7.1版本设计的,同时还有一个更新的版本,即jQuery 1.11.1,这为开发者提供...

    jsTree树控件(基于jQuery, 超强悍)

    **jsTree:基于jQuery的超强大树形控件** jsTree是一款高度可定制的JavaScript库,专注于构建交互式的树形结构。它完全基于jQuery,因此能够无缝地融入任何已使用jQuery的项目中,同时支持所有主流浏览器,包括...

    树形下拉控件

    在本案例中,我们关注的是基于Bootstrap框架实现的树形下拉列表控件。 Bootstrap,由Twitter开发并开源,是目前最流行和广泛使用的前端开发框架之一,它提供了一系列预先设计的CSS和JavaScript组件,可以帮助开发者...

    很好用很漂亮的日期控件

    其次,日期控件有多种类型,常见的有下拉式日历、滑动日历、弹出式日历和输入框等。下拉式日历通常出现在下拉菜单中,简洁而不占空间;滑动日历允许用户通过手指滑动来浏览月份,直观易用;弹出式日历在点击输入框后...

    jQuery日期选择器插件自定义多种日期选择

    常见的日期选择器有下拉框式、日历弹窗式等。jQuery的日期选择器插件通过提供API和配置选项,可以定制各种展示效果。 默认情况下,插件会显示一个平铺式的日期选择器,用户可以通过直接点击日历上的日期来选择。...

    jQuery 页面框架 母板页

    例如,jQuery UI提供了许多可定制的UI元素,如对话框、拖放功能和日期选择器,而Bootstrap则以其网格系统和易于使用的CSS类而闻名。 母板页(Master Page)是ASP.NET框架中的一个特性,用于创建共享网站布局和设计...

    asp.net下拉多选控件

    考虑到现代Web应用的跨设备兼容性,下拉多选控件应具备良好的响应式设计。这可能涉及调整布局、字体大小以及触摸友好的交互方式,以适应不同的屏幕尺寸和输入设备。 7. **数据绑定** ASP.NET控件支持多种数据绑定...

    jquery easyUI JS库和API 附加日期控件库My97DatePickerBeta.zip

    jQuery EasyUI是一个基于jQuery的前端框架,它提供了一套完整的用户界面组件,帮助开发者快速构建交互式的Web应用程序。这个框架大大简化了HTML页面的样式和行为设置,使得开发者可以更加专注于业务逻辑的实现,而...

Global site tag (gtag.js) - Google Analytics